js阻止默认事件,如a标签跳转和事件冒泡

禁止a标签点击跳转

在事件执行过程中使用  return false  提前终止事件,例:

  

<a href="http://baidu.com" onclick="return fasle">点我啊</a>

原理是当点击a标签时首先触发onclick函数,然后才执行href的跳转。但是在执行到return false的时候直接终止了执行,也就没有了链接的跳转。

目前疑问是return false 和 return true 以及 return的作用都是结束当前函数的执行并分别返回 false, true, undefined。但是如果把a标签onclick函数换成return 或return true后还是会执行页面跳转的。

因此,初步推断当执行完onclick事件后会根据返回值进行下一步操作,比如如果是false就终止当前事件的继续执行。

当然还可以通过这样设置  href="javascript:void(0);" 来防止超链接跳转。

阻止默认事件以及事件冒泡

禁止事件传输过程中的冒泡,IE和其它浏览器的方式不同,代码如下:

var evt = evt || window.event; //获取event对象
    if (evt.preventDefault) {
        evt.preventDefault(); //非IE浏览器
   } else {
        evt.returnValue = false; //在早期的IE版本中
  }
event.stopPropagation ? event.stopPropagation() : (event.cancelBubble = true); //阻止事件冒泡
原文地址:https://www.cnblogs.com/zhaozhipeng/p/7417947.html