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 相关文章推荐
js操纵跨frame的三级联动select下拉选项实例介绍
May 19 Javascript
javascript中的return和闭包函数浅析
Jun 06 Javascript
jQuery中queue()方法用法实例
Dec 29 Javascript
javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
May 13 Javascript
jQuery实现页面顶部显示的进度条效果完整实例
Dec 09 Javascript
浅析JavaScript回调函数应用
May 22 Javascript
用JS实现图片轮播效果代码(一)
Jun 26 Javascript
nginx配置React静态页面的方法教程
Nov 03 Javascript
关于axios不能使用Vue.use()浅析
Jan 12 Javascript
js实现一款简单踩白块小游戏(曾经很火)
Dec 02 Javascript
Vue移动端实现图片上传及超过1M压缩上传
Dec 23 Javascript
vue $mount 和 el的区别说明
Sep 11 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新手上路(十三)
2006/10/09 PHP
Cakephp 执行主要流程
2010/03/24 PHP
基于flush()不能按顺序输出时的解决办法
2013/06/29 PHP
php获取指定范围内最接近数的方法
2015/06/02 PHP
swoole和websocket简单聊天室开发
2017/11/18 PHP
json 定义
2008/06/10 Javascript
JS自定义功能函数实现动态添加网址参数修改网址参数值
2013/08/02 Javascript
获得Javascript对象属性个数的示例代码
2013/11/21 Javascript
jquery改变tr背景色的示例代码
2013/12/28 Javascript
avalon js实现仿google plus图片多张拖动排序附源码下载
2015/09/24 Javascript
理解javascript中的严格模式
2016/02/01 Javascript
Bootstrap CSS组件之导航(nav)
2016/12/17 Javascript
jQuery EasyUI 折叠面板accordion的使用实例(分享)
2017/12/25 jQuery
在vue项目中使用element-ui的Upload上传组件的示例
2018/02/08 Javascript
JavaScript时间与时间戳的转换操作实例分析
2018/12/07 Javascript
nuxt中使用路由守卫的方法步骤
2019/01/27 Javascript
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
2019/10/11 Javascript
vue将data恢复到初始状态 &amp;&amp; 重新渲染组件实例
2020/09/04 Javascript
[07:43]《辉夜杯》公开赛晋级外卡赛战队—TRG训练生活探秘
2015/12/11 DOTA
[10:39]DOTA2上海特级锦标赛音乐会纪录片
2016/03/21 DOTA
python中pip的使用和修改下载源的方法
2019/07/08 Python
keras在构建LSTM模型时对变长序列的处理操作
2020/06/29 Python
浅谈anaconda python 版本对应关系
2020/10/07 Python
纯CSS3实现表单验证效果(非常不错)
2017/01/18 HTML / CSS
做一个能自适应高度的textarea的示例代码
2019/09/06 HTML / CSS
VELTRA台湾:世界自由行专家
2017/08/15 全球购物
大韩航空官方网站:Korean Air
2017/10/25 全球购物
购买中国最好的电子产品:Geekbuying
2018/03/13 全球购物
统计每一学生的平均成绩
2014/06/06 面试题
中秋节礼品促销方案
2014/02/02 职场文书
老龄工作先进事迹
2014/08/15 职场文书
2014年销售助理工作总结
2014/12/01 职场文书
活动主持人开场白
2015/05/28 职场文书
党员理论学习心得体会
2016/01/21 职场文书
Vue自定义铃声提示音组件的实现
2022/01/22 Vue.js
Python+Selenium实现抖音、快手、B站、小红书、微视、百度好看视频、西瓜视频、微信视频号、搜狐视频、一点号、大风号、趣头条等短视频自动发布
2022/04/13 Python