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 target与currentTarget区别说明
Aug 28 Javascript
JavaScript Math.ceil() 函数使用介绍
Dec 11 Javascript
JS判断客服QQ号在线还是离线状态的方法
Jan 13 Javascript
JavaScript 学习笔记之基础中的基础
Jan 13 Javascript
Angular.JS学习之依赖注入$injector详析
Oct 20 Javascript
jQuery实现隔行变色的方法分析(对比原生JS)
Nov 18 Javascript
canvas绘制的直线动画
Jan 23 Javascript
完美解决spring websocket自动断开连接再创建引发的问题
Mar 02 Javascript
webpack构建react多页面应用详解
Sep 15 Javascript
Vue-Cli 3.0 中配置高德地图的两种方式
Jun 19 Javascript
微信小程序实现上拉加载功能示例【加载更多数据/触底加载/点击加载更多数据】
May 29 Javascript
用云开发Cloudbase实现小程序多图片内容安全监测的代码详解
Jun 07 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 api函数实现数组的交换排序示例
2014/04/13 PHP
C/S和B/S两种架构区别与优缺点分析
2014/10/23 PHP
调用WordPress函数统计文章访问量及PHP原生计数器的实现
2016/03/21 PHP
php封装的smartyBC类完整实例
2016/10/19 PHP
LNMP部署laravel以及xhprof安装使用教程
2017/09/14 PHP
PHP实现转盘抽奖算法分享
2020/04/15 PHP
让textarea控件的滚动条怎是位与最下方
2007/04/20 Javascript
javascript之卸载鼠标事件的代码
2007/05/14 Javascript
JavaScript 继承机制的实现(待续)
2010/05/18 Javascript
javascript 设为首页与加入收藏兼容多浏览器代码
2011/01/11 Javascript
根据邮箱的域名跳转到相应的登录页面的代码
2012/02/27 Javascript
中文路径导致unitpngfix.js不正常的解决方法
2013/06/26 Javascript
JavaScript对表格或元素按文本,数字或日期排序的方法
2015/05/26 Javascript
如何实现json数据可视化详解
2016/11/24 Javascript
微信小程序开发(二)图片上传+服务端接收详解
2017/01/11 Javascript
微信小程序 scroll-view实现上拉加载与下拉刷新的实例
2017/01/21 Javascript
详解在vue-cli项目中安装node-sass
2017/06/21 Javascript
JS实现可针对算术表达式求值的计算器功能示例
2018/09/04 Javascript
为什么说JavaScript预解释是一种毫无节操的机制详析
2018/11/18 Javascript
Vue 电商后台管理项目阶段性总结(推荐)
2020/08/22 Javascript
JavaScript实现点击切换功能
2021/01/27 Javascript
Python是编译运行的验证方法
2015/01/30 Python
Python文件和目录操作详解
2015/02/08 Python
浅析Python中的多条件排序实现
2016/06/07 Python
Python爬取网易云音乐热门评论
2017/03/31 Python
将TensorFlow的模型网络导出为单个文件的方法
2018/04/23 Python
python3获取url文件大小示例代码
2019/09/18 Python
python实现银行管理系统
2019/10/25 Python
python使用pygame实现笑脸乒乓球弹珠球游戏
2019/11/25 Python
Django通用类视图实现忘记密码重置密码功能示例
2019/12/17 Python
打印tensorflow恢复模型中所有变量与操作节点方式
2020/05/26 Python
Python中内建模块collections如何使用
2020/05/27 Python
python3.7调试的实例方法
2020/07/21 Python
教师听课评语大全
2014/12/31 职场文书
利用Python实现Picgo图床工具
2021/11/23 Python
vue代码分块和懒加载非必要资源文件
2022/04/11 Vue.js