页面中有多个绑定事件因此可能出现多个元素响应同一个事件，由此引发了事件不是我们预期的，这种现象就是事件冒泡，要处理这个问题可以对事件的作用范围进行限制，Jquery中使得stopPropagation()方法停止事件的冒泡。事件冒泡示例：
<body><div><span>事件冒泡</span>div内容</div>body内容</body> $("body").click(function(){alert("body");}); $("body div").click(function(){alert("div");}); $("span").click(function(){alert("span");});
在该示例中当点击span时候会触发三个打印事件 "span" "div" "body"，如何阻止事件冒泡？可以使用Jquery事件中的stropPropagation()方法来停止事件冒泡。上面示例改成这样：
$("body").click(function(event){alert("body");event.stopPropagation();}); $("body div").click(function(event){alert("div");event.stopPropagation();}); $("span").click(function(event){alert("span");event.stopPropagation();});
这样当点击不同元素时候就不会发生冒泡事件。
七、事件命名空间
事件添加命名空间便于事件的管理:删除事件和触发事件。例：
<div>元素绑定多个事件</div>
$("div").bind("click.plugin",function(){alert("click.plugin");}); $("div").bind("click",function(){alert("click");}); $("div").bind("mouseover.plugin",function(){alert("mouseover.plugin");}); $("div").bind("dbclick",function(){alert("dbclick");});
由于使用了命名空间可以删除指定命名空间中的事件，如移除所有plugin命名空间下的事件函数方法如下:$("button").click(function(){$("div").unbind(".plugin");});这样就移除了所有命名空间是plugin的事件函数。div中只剩下click和dbclick绑定事件。
使用命名空间对触发特定的事件了带来了方便，如为div绑定了两个click事件，一个是带命名空间的一个是不带命名空间。如果想要触发不包含在命名空间中的事件可以使用trigger("click!")方法，！感叹号的作用是匹配所有不包含在命名空间中的click方法。
以上这篇Jquery基础之事件操作详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
您可能感兴趣的文章: