return false,对阻止事件默认动作的一些测试代码

  首先页面上有一个 <textarea id="test"></textarea>

  我们为其绑定以下事件

  

复制代码 代码如下:

  test.onkeydown = function(){

  return false;

  }

  test.onkeyup = function(){

  return false;

  }

  test.onkeypress = function(){

  return false;

  }

  我们分别注释掉其中的两个事件,每次测试仅绑定一个事件。

  很明显我们每个函数都返回false,如果返回值可以阻止事件默认动作,那么文本框将无法输入任何内容。

  看下面我测试的结果,注意红的部分。

  最后我分别把事件绑定两次,每次返回false看是否能阻止默认动作。

  还是用了一个a标记测试onclick 返回false 是否跳转。

  

侦听事件返回 false 是否阻止事件默认动作
  chrome IE-8 firfox oper Safari
onkeydown yes yes yes no yes
onkeyup no no no no no
onkeypress yes yes yes yes yes
onclick yes yes yes yes yes
keydown * 2 no 取最后的FN结果 no no no
keypress * 2 no 取最后的FN结果 no no no
click * 2 no 取最后的FN结果 no no no
e.preventDefault(); yes no yes yes(keydown:no) yes
e.returnValue = false no yes no no no

  可以看出浏览器表现确实不太一样,当然IE是最麻烦的东西了。

  最意外的是在oper中 绑定down 返回false,居然也不能阻止默认动作。

  所以以后在写要阻止浏览器默认动作的时候,还用标准的方法比较好。(后面我提供了)

  不然在多人协作的工作中,会相当麻烦。

  演示的deom 有需要的可以发邮件给我。我就不贴上来了。

  

复制代码 代码如下:

  /* * 用下面的代码就不会发生悲剧了

  * 最终结论

  * E(e).stop(); 阻止时间冒泡

  * E(e).prevent();阻止时间默认行为

  */

  var E = function(e){

  e = window.event || e;

  return {

  stop: function() {

  if (e && e.stopPropagation) e.stopPropagation();

  else e.cancelBubble = true

  },

  prevent: function() {

  if (e && e.preventDefault) e.preventDefault();

  else e.returnValue = false

  }

  }

  }