<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>事件中的冒泡现象</title>
<script type="text/javascript"
src="Jscript/jquery-1.8.2.min.js">
</script>
<style type="text/css">
body{font-size:13px}
.clsShow{border:#ccc 1px solid;background-color:#eee;margin-top:15px;padding:5px;width:220px;line-height:1.8em;display:none}
.btn {border:#666 1px solid;padding:2px;width:50px;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffff, EndColorStr=#ECE9D8);}
</style>
<script type="text/javascript">
$(function() {
var intI = 0; //记录执行次数
$("body,div,#btnShow").click(function(event) {//点击事件
intI++; //次数累加
$(".clsShow")
.show()//显示
.html("您好，欢迎来到jQuery世界!")//设置内容
.append("<div>执行次数 <b>" + intI + "</b> </div>"); //追加文本
event.stopPropagation();//阻止冒泡过程
})
})
</script>
</head>
<body>
<div>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
