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 相关文章推荐
jquery插件制作 提示框插件实现代码
Aug 17 Javascript
关于extjs treepanel复选框选中父节点与子节点的问题
Apr 02 Javascript
IE8对JS通过属性和数组遍历解析不一样的地方探讨
May 06 Javascript
js 程序执行与顺序实现详解
May 13 Javascript
HTML页面弹出居中可拖拽的自定义窗口层
May 07 Javascript
举例详解AngularJS中ngShow和ngHide的使用方法
Jun 19 Javascript
socket.io学习教程之基本应用(二)
Apr 29 Javascript
全面解析jQuery中的$(window)与$(document)的用法区别
Aug 15 jQuery
基于JavaScript+HTML5 实现打地鼠小游戏逻辑流程图文详解(附完整代码)
Nov 02 Javascript
vue2.0与bootstrap3实现列表分页效果
Nov 28 Javascript
Webpack框架核心概念(知识点整理)
Dec 22 Javascript
浅析vue给不同环境配置不同打包命令
Aug 17 Javascript
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/02/02 PHP
PHP常用的三种设计模式汇总
2016/08/28 PHP
PHP与Web页面交互操作实例分析
2020/06/02 PHP
php提高脚本性能的4个技巧
2020/08/18 PHP
Jquery ajaxsubmit上传图片实现代码
2010/11/04 Javascript
jquery div 居中技巧应用介绍
2012/11/24 Javascript
jQuery实现购物车表单自动结算效果实例
2015/08/10 Javascript
详解vue中引入stylus及报错解决方法
2017/09/22 Javascript
swiper插件自定义切换箭头按钮
2017/12/28 Javascript
AjaxUpLoad.js实现文件上传
2018/03/05 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
2018/04/13 Javascript
微信小程序实现弹出菜单
2018/07/19 Javascript
详解Vue项目引入CreateJS的方法(亲测可用)
2019/05/30 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
js实现炫酷光感效果
2020/09/05 Javascript
vue 解决provide和inject响应的问题
2020/11/12 Javascript
Vue如何实现变量表达式选择器
2021/02/18 Vue.js
Python实现将n个点均匀地分布在球面上的方法
2015/03/12 Python
Python发送以整个文件夹的内容为附件的邮件的教程
2015/05/06 Python
通过数据库对Django进行删除字段和删除模型的操作
2015/07/21 Python
Python实现爬取马云的微博功能示例
2019/02/16 Python
Flask模板引擎之Jinja2语法介绍
2019/06/26 Python
Python函数中参数是传递值还是引用详解
2019/07/02 Python
python对XML文件的操作实现代码
2020/03/27 Python
python变量的作用域是什么
2020/05/26 Python
使用phonegap克隆和删除联系人的实现方法
2017/03/31 HTML / CSS
编写一个类体现构造,公有,私有方法,静态,私有变量
2013/08/10 面试题
生产部经理岗位职责
2013/12/16 职场文书
党的群众路线教育实践活动宣传方案
2014/02/23 职场文书
群众路线教育实践活动的心得体会
2014/09/03 职场文书
捐助感谢信
2015/01/22 职场文书
2015年高一班主任工作总结
2015/05/13 职场文书
诚实守信主题班会
2015/08/13 职场文书
Canvas三种动态画圆实现方法说明(小结)
2021/04/16 Javascript
「睡美人」爱洛公主粘土人开订
2022/03/22 日漫
利用Redis实现点赞功能的示例代码
2022/06/28 Redis