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下用层来实现select的title提示属性
Feb 23 Javascript
jQuery 无刷新分页实例代码
Nov 12 Javascript
javascript控制在光标位置插入文字适合表情的插入
Jun 09 Javascript
怎么引入(调用)一个JS文件
May 26 Javascript
ionic js 模型 $ionicModal 可以遮住用户主界面的内容框
Jun 06 Javascript
javascript实现简单的ajax封装示例
Dec 28 Javascript
node.js 中间件express-session使用详解
May 20 Javascript
详解Vue2中组件间通信的解决全方案
Jul 28 Javascript
微信小程序使用navigateTo数据传递的实例
Sep 26 Javascript
老生常谈JavaScript面向对象基础与this指向问题
Oct 16 Javascript
node中的密码安全(加密)
Sep 17 Javascript
Vue如何将页面导出成PDF文件
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 记录进行累加并显示总时长为秒的结果
2011/11/04 PHP
PHP扩展开发入门教程
2015/02/26 PHP
php实现用于验证所有类型的信用卡类
2015/03/24 PHP
php无限分类使用concat如何实现
2015/11/05 PHP
Ubuntu彻底删除PHP7.0的方法
2018/07/27 PHP
PHP抽象类与接口的区别实例详解
2019/05/09 PHP
innerHTML,outerHTML,innerText,outerText的用法及区别解析
2013/12/16 Javascript
jQuery遍历对象、数组、集合实例
2014/11/08 Javascript
javascript自定义右键弹出菜单实现方法
2015/05/25 Javascript
Immutable 在 JavaScript 中的应用
2016/05/02 Javascript
jquery中的常见问题及快速解决方法小结
2016/06/14 Javascript
js将滚动条滚动到指定位置的简单实现方法
2016/06/25 Javascript
IntersectionObserver API 详解篇
2016/12/11 Javascript
js实现定时进度条完成后切换图片
2017/01/04 Javascript
jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例
2017/01/30 Javascript
浅析JavaScript中var that=this
2017/02/17 Javascript
详解Angular.js指令中scope类型的几种特殊情况
2017/02/21 Javascript
jquery实现左右滑动式轮播图
2017/03/02 Javascript
three.js中3D视野的缩放实现代码
2017/11/16 Javascript
详解基于node.js的脚手架工具开发经历
2019/01/28 Javascript
微信小程序实现获取小程序码和二维码java接口开发
2019/03/29 Javascript
Nodejs实现图片上传、压缩预览、定时删除功能
2019/10/25 NodeJs
解决vue路由name同名,路由重复的问题
2020/08/05 Javascript
[02:31]2018年度DOTA2最具人气选手-完美盛典
2018/12/16 DOTA
简单介绍Python中的try和finally和with方法
2015/05/05 Python
python实现将读入的多维list转为一维list的方法
2018/06/28 Python
Python检测数据类型的方法总结
2019/05/20 Python
keras:model.compile损失函数的用法
2020/07/01 Python
HTML5 Video/Audio播放本地文件示例介绍
2013/11/18 HTML / CSS
Richards网上商店:当代时尚,遍布巴西
2019/11/03 全球购物
开办饭店创业计划书
2013/12/28 职场文书
实习心得体会
2014/01/02 职场文书
生物学学生自我评价
2014/01/17 职场文书
药学专业学生的自我评价分享
2014/02/06 职场文书
辞职信怎么写?
2019/05/21 职场文书
导游词之北京明十三陵
2019/10/28 职场文书