jQuery中阻止冒泡
-
-
-
-
-
-
- #wrap{
- width:500px;
- height:400px;
- pink; < /span>
- }
- #center{
- width:300px;
- height:300px;
- red; < /span>
- }
- #inner{
- width:100px;
- height:100px;
- background:#fff;
- }
-
-
-
- $(function(){
- $("#wrap").click(function(){
- alert("我是最外层");
- });
- $("#center").click(function(aaa){//传一个参数,这个参数不仅可以是event,也可以是其他的,参数可以自定义
- alert("我是中间层");
- aaa.stopPropagation();//给这个参数一个stopPropagation()方法,这样就可以阻止冒泡了
- });
- $("#inner").click(function(){
- alert("我是最里层");
- return false;//直接用return false代替aaa.stopPropagation()也可以阻止冒泡
- })
- })
-
-
-
-
我是最外层
-
我是中间层
-
我是最里层
冒泡:当一个元素里面包着其他元素,里面和外面的元素都给点击事件,点击里面的元素时同
时会触发外面的元素,造成意外的效果。冒泡就是因为事件会按照DOM的层次结构像水泡一样不断向上
直至顶端。
解决停止冒泡的方法一:1.给每一个元素一个事件对象,event
2.用stopPropagation()方法停止冒泡。
解决停止冒泡方法二:return false
网站栏目:jQuery中阻止冒泡
转载源于:
http://cdweb.net/article/ieoodd.html