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失效的解决方法
Jun 26 Javascript
js confirm()方法的使用方法实例
Jul 13 Javascript
导航跟随滚动条置顶移动示例代码
Sep 11 Javascript
简单选项卡 js和jquery制作方法分享
Feb 26 Javascript
JavaScript获取一个范围内日期的方法
Apr 24 Javascript
BootStrap网页中代码显示用法详解
Oct 21 Javascript
基于百度地图实现产品销售的单位位置查看功能设计与实现
Oct 21 Javascript
angular和BootStrap3实现购物车功能
Jan 25 Javascript
AngularJS之页面跳转Route实例代码
Mar 10 Javascript
AngularJs 最新验证手机号码的实例,成功测试通过
Nov 26 Javascript
简化vuex的状态管理方案的方法
Jun 02 Javascript
echarts大屏字体自适应的方法步骤
Jul 12 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
mayfish 数据入库验证代码
2010/04/30 PHP
PHP 编写大型网站问题集
2010/05/07 PHP
php header示例代码(推荐)
2010/09/08 PHP
PHP操作mysql函数详解,mysql和php交互函数
2011/05/19 PHP
CodeIgniter启用缓存和清除缓存的方法
2014/06/12 PHP
php实现根据字符串生成对应数组的方法
2014/09/22 PHP
Yii入门教程之Yii安装及hello world
2014/11/25 PHP
浅谈php错误提示及查错方法
2015/07/14 PHP
PHP使用Memcache时模拟命名空间及缓存失效问题的解决
2016/02/27 PHP
php 反斜杠处理函数addslashes()和stripslashes()实例详解
2016/12/25 PHP
php设计模式之建造器模式分析【星际争霸游戏案例】
2020/01/23 PHP
onkeydown事件解决按回车键直接提交数据的需求
2013/04/11 Javascript
jQuery实现转动随机数抽奖效果的方法
2015/05/21 Javascript
javascript中使用new与不使用实例化对象的区别
2015/06/22 Javascript
表单中单选框添加选项和移除选项
2016/07/04 Javascript
Bootstrap Table使用心得总结
2016/11/29 Javascript
Node.js中的require.resolve方法使用简介
2017/04/23 Javascript
浅谈JsonObject中的key-value数据解析排序问题
2017/12/06 Javascript
javascript利用键盘控制小方块的移动
2020/04/20 Javascript
Python检测QQ在线状态的方法
2015/05/09 Python
python实现文本界面网络聊天室
2018/12/12 Python
将Python字符串生成PDF的实例代码详解
2019/05/17 Python
CSS3 3D立方体效果示例-transform也不过如此
2016/12/05 HTML / CSS
CSS3模拟动画下拉菜单效果
2017/04/12 HTML / CSS
HTML5 FileReader对象的具体使用方法
2020/05/22 HTML / CSS
中国综合网上购物商城:苏宁易购
2016/08/09 全球购物
Python里面如何拷贝一个对象
2014/02/17 面试题
毕业生个人求职的自我评价
2013/10/28 职场文书
庆七一活动方案
2014/01/25 职场文书
仓管岗位职责范本
2014/02/08 职场文书
模具设计与制造专业推荐信
2014/02/16 职场文书
《鸿门宴》教学反思
2014/04/22 职场文书
货物运输服务质量承诺书
2014/05/29 职场文书
文艺晚会策划方案
2014/06/11 职场文书
工作散漫检讨书
2014/09/16 职场文书
Axios代理配置及封装响应拦截处理方式
2022/04/07 Vue.js