js阻止冒泡和阻止浏览器的默认行为

96
南蓝NL
2017.12.22 16:53 字数 178

防止冒泡

举一个例子,就是在子元素当中触发click事件,它的父元素有click事件的话,也会被触发,我们就需要用event.stopPropagation来防止冒泡。Ie使用的是cancelBubble,w3c使用的是stopPropagation()

 <div id="div" onclick="alert('div')">
       <ul onclick="alert('ul')">
           <li onclick="alert('li')">test</li>
       </ul>
   </div>
  function myfn(e){
           window.event?window.event.cancelBubble = true: e.stopPropagation();
       }

没有添加以上代码,依次弹出li,ul,div;加了防止事件冒泡之后只会弹出li

阻止浏览器的默认行为。IE使用的是returnValue;w3c使用是preventDefault

//假设有<a href="www.baidu.com" id="testA"></a>
  var a = document.getElementById("testA");
       a.onclick = function(e){
           if(e.preventDefault){
               e.preventDefault();
           }else{
               window.event.returnValue == false;
           }
       }

js的return false

js的return false只能阻止浏览器的默认行为,不能阻止冒泡行为

 var a = document.getElementById("testA");
       a.onclick = function(e){
return false;
}

jq的return false 既能阻止浏览器的默认行为,又能阻止冒泡行为

web前端笔记
Gupao