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 相关文章推荐
关于IE浏览器以及Firefox下的javascript冒泡事件的响应层级
Oct 14 Javascript
JS跨域总结
Aug 30 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
Dec 05 Javascript
js实现select组件的选择输入过滤代码
Oct 14 Javascript
javascript实现图片自动和可控的轮播切换特效
Apr 13 Javascript
jQuery添加和删除指定标签的方法
Dec 16 Javascript
jQuery动态加载css文件实现方法
Jun 15 Javascript
JavaScript自学笔记(必看篇)
Jun 23 Javascript
谈谈PHP中相对路径的问题与绝对路径的使用
Aug 16 Javascript
jQuery实现大图轮播
Feb 13 Javascript
原生js FileReader对象实现图片上传本地预览效果
Mar 27 Javascript
js实现上传图片到服务器
Apr 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
我的论坛源代码(五)
2006/10/09 PHP
php中debug_backtrace、debug_print_backtrace和匿名函数用法实例
2014/12/01 PHP
php隐藏实际地址的文件下载方法
2015/04/18 PHP
详解WordPress开发中用于获取分类及子页面的函数用法
2016/01/08 PHP
PHP实现补齐关闭的HTML标签
2016/03/22 PHP
php实现数组重复数字统计实例
2018/09/30 PHP
Prototype Class对象学习
2009/07/19 Javascript
用js实现层随着内容大小动态渐变改变 推荐
2009/12/19 Javascript
Javascript 实用小技巧
2010/04/07 Javascript
jquery 跨域访问问题解决方法(笔记)
2011/06/08 Javascript
js图片实时加载提供网页打开速度
2014/09/11 Javascript
jQuery实现右下角可缩放大小的层完整实例
2016/06/20 Javascript
javascript实现的左右无缝滚动效果
2016/09/19 Javascript
微信小程序 二维码canvas绘制实例详解
2017/01/06 Javascript
JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)
2017/03/30 Javascript
使用react实现手机号的数据同步显示功能的示例代码
2018/04/03 Javascript
Vue项目数据动态过滤实践及实现思路
2018/09/11 Javascript
js字符串倒序的实例代码
2018/11/30 Javascript
jsonp格式前端发送和后台接受写法的代码详解
2019/11/07 Javascript
js实现网页版贪吃蛇游戏
2020/02/22 Javascript
javascript设计模式 ? 适配器模式原理与应用实例分析
2020/04/13 Javascript
[01:30:55]VG vs Mineski Supermajor 败者组 BO3 第三场 6.6
2018/06/07 DOTA
[04:46]2018年度玩家喜爱的电竞媒体-完美盛典
2018/12/16 DOTA
跟老齐学Python之玩转字符串(2)
2014/09/14 Python
Python中序列的修改、散列与切片详解
2017/08/27 Python
python图书管理系统
2020/04/05 Python
Python JSON格式数据的提取和保存的实现
2019/03/22 Python
Pytorch: 自定义网络层实例
2020/01/07 Python
使用sklearn的cross_val_score进行交叉验证实例
2020/02/28 Python
COS美国官网:知名服装品牌
2019/04/08 全球购物
办公自动化专业大学生职业规划书
2014/03/06 职场文书
考博专家推荐信
2014/05/10 职场文书
优秀教师事迹材料
2014/12/15 职场文书
好人好事新闻稿
2015/07/17 职场文书
2015年信息技术教研组工作总结
2015/07/22 职场文书
浅谈MySQL 亿级数据分页的优化
2021/06/15 MySQL