由href return false 来看阻止默认事件

不少时候咱们都想阻止一个a ?link的href跳转。

 

1	<a onclick=” return  false ;” href=”www. 360 .cn”>click</a>

以上代码能够达到这个效果

有一点要注意

 

1 2 3 4 5 6 7

function  stop(){    return  false ;    }    <a onclick=”stop();” href=”www. 360 .cn”>click</a>

这么写是不会阻止默认事件的，stop()反回false， ?onclick却没有返回值 只有事件的返回值是false时 才会阻止默认事件 因此要这么写：

 

1	<a onclick=” return  stop();” href=”www. 360 .cn”>click</a>

这样就会有效果， 那么若是是用绑定事件的方式呢 会怎么样呢

qwrap是用标准的事件绑定方式来作的 能够用它来测试

 

1 2 3

<a id=”testa” href=”www. 360 .cn”>click</a>    W(‘#testa’).click( function (){  return  false ;}); // 这是一个标准的绑定事件方法

测试后发现 ie是能够阻止默认事件的 ?标准浏览器 chrome firefox等却没有能阻止 直接发生了跳转

分析后发现由于标准浏览器使用 addEventListener 绑定事件 而该方法是没有返回值的，可参见w3c文档 没有返回值， 返回值固然不会是false因此继续执行href 。

而ie使用attachEvent的方法这个方法是有returnValue的参见?http://msdn.microsoft.com/en-us/library/ie/aa703898(v=vs.85).aspx

因此成功阻止了默认事件，

那么使用addEventListener绑定事件 如何阻止呢 ？

虽然addEventListener 不能有返回值 可是它有一个方法 preventDefault() 专门用来阻止默认事件 ，

1	W(‘#testa’).click( function (e){ e.preventDefault();});

这样就能够成功阻止了.

因此 用addEventListener绑定的事件 必须用preventDefault()来阻止默认事件

可是又有一个现象

1	$(‘#testa’).click( function (){ return  false ;});

query 却能够作到， 以上代码运行成功在全部浏览器

这是为何 ？这并非jquery能够例外 只是它悄悄的调用了preventDefault() 和 stopPropagation()

jqeury会把事件的响应函数封装在一个dispach的函数里 若是发现你的函数return false 就会同时调会preventDefault() 和stopPropagation()

因此在jquery中 return false 等价于：

1 2 3 4 5

e.preventDefault()    e.stopPropagation()    return  false ;

这三个