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


Posted in Javascript onNovember 17, 2010

首先页面上有一个 <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 
} 
} 
}
Javascript 相关文章推荐
一个tab标签切换效果代码
Mar 27 Javascript
Java 正则表达式学习总结和一些小例子
Sep 13 Javascript
js操作CheckBoxList实现全选/反选(在客服端完成)
Feb 02 Javascript
jQuery 设置 CSS 属性示例介绍
Jan 16 Javascript
jquery基础教程之deferred对象使用方法
Jan 22 Javascript
javascript制作的简单注册模块表单验证
Apr 13 Javascript
由浅入深讲解Javascript继承机制与simple-inheritance源码分析
Dec 13 Javascript
JavaScript实现数据类型的相互转换
Mar 06 Javascript
jQuery增加和删除表格项目及实现表格项目排序的方法
May 30 Javascript
浅谈js中的in-for循环
Jun 28 Javascript
微信小程序 教程之列表渲染
Oct 18 Javascript
jQuery实现简单评论区功能
Oct 26 jQuery
javascript利用初始化数据装配模版的实现代码
Nov 17 #Javascript
javascript拓展DOM操作 prependChild insertAfert
Nov 17 #Javascript
Javascript 静态页面实现随机显示广告的办法
Nov 17 #Javascript
Json对象替换字符串占位符实现代码
Nov 17 #Javascript
xml文档转换工具,附图表例子(hta)
Nov 17 #Javascript
js判断输入是否为正整数、浮点数等数字的函数代码
Nov 17 #Javascript
基于jQuery的图片大小自动适应实现代码
Nov 17 #Javascript
You might like
PHP遍历数组的方法汇总
2015/04/30 PHP
简单谈谈favicon
2015/06/10 PHP
ThinkPHP数据操作方法总结
2015/09/28 PHP
PHP面向对象学习之parent::关键字
2017/01/18 PHP
php中请求url的五种方法总结
2017/07/13 PHP
Yii2压缩PHP中模板代码的输出问题
2018/08/28 PHP
JavaScript 拖拉缩放效果
2008/12/10 Javascript
Jquery 实现Tab效果 思路是js思路
2010/03/02 Javascript
jQuery获取css z-index在各种浏览器中的返回值
2010/09/15 Javascript
30个最佳jQuery Lightbox效果插件分享
2011/04/11 Javascript
基于pthread_create,readlink,getpid等函数的学习与总结
2013/07/17 Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
2014/08/12 Javascript
javascript面向对象之访问对象属性的两种方式分析
2015/01/13 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
实现JavaScript的组成----BOM和DOM详解
2016/05/18 Javascript
IE下JS保存图片的简单实例
2016/07/15 Javascript
bootstrap表格分页实例讲解
2016/12/30 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
2017/01/19 Javascript
AngularJS下$http服务Post方法传递json参数的实例
2018/03/29 Javascript
详解从NodeJS搭建中间层再谈前后端分离
2018/11/13 NodeJs
浅谈vue中$event理解和框架中在包含默认值外传参
2020/08/07 Javascript
python使用in操作符时元组和数组的区别分析
2015/05/19 Python
pandas 根据列的值选取所有行的示例
2018/11/07 Python
零基础使用Python读写处理Excel表格的方法
2019/05/02 Python
Python tkinter实现图片标注功能(完整代码)
2019/12/08 Python
python+selenium定时爬取丁香园的新型冠状病毒数据并制作出类似的地图(部署到云服务器)
2020/02/09 Python
Python定时器线程池原理详解
2020/02/26 Python
纪伊国屋新加坡网上书店:Kinokuniya新加坡
2017/12/29 全球购物
计算机专业个人求职信范例
2013/09/23 职场文书
大学生收银员求职信分享
2014/01/02 职场文书
银行委托书范本
2014/09/28 职场文书
2014年企业党支部工作总结
2014/12/04 职场文书
2015年敬老月活动总结
2015/03/27 职场文书
初中化学教学反思
2016/02/22 职场文书
Python 数据可视化之Bokeh详解
2021/11/02 Python
正则表达式基础与常用验证表达式
2022/06/16 Javascript