`
qingfengjushi1
  • 浏览: 139033 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JQuery事件冒泡

jQueryHTML 
阅读更多
JQuery中的事件冒泡是指事件会按照DOM层次结构像水泡一样不断向上直至顶端，如下代码： 
<html>
	<head><title>test1</title>
			<script src="./jquery-1.3.2.min.js" type="text/javascript"></script>
			<script>
				$(document).ready (
					function() {
						$("body").bind("click", function() {
							alert("body click");
						});
						$("span").bind("click", function(event) {
							alert("span click");
						});
						$("#msg").bind("click", function(event) {
							alert("div click");
						});
					}
				);
			</script>
	</head>
	<body>
		<span>
			<div id="msg">aaa</div>
		</span>
	</body>
</html>

当点击div后事件会触发,从里到外依次弹出"div click","span click","body click"。如果想要在点击div时只弹出"div click",需要阻止事件冒泡,只需在div的click事件对象中调用stopPropagation方法，阻止事件冒泡代码如下： 
$("#msg").bind("click", function(event) {
							alert("div click");
							event.stopPropagation();
						});

此时点击div时只会弹出"div click"。
分享到：
| Oracle11G 用户密码过期
评论
1 楼 jallin 2010-06-21  
多谢！按照你的方法搞定了
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics