return false,对阻止事件默认动作的一些测试代码
更新时间：2010年11月17日 20:37:20 作者：
很明显我们每个函数都返回false,如果返回值可以阻止事件默认动作，那么文本框将无法输入任何内容。
看下面我测试的结果，注意红的部分。
首先页面上有一个 <textarea id="test"></textarea>
我们为其绑定以下事件
test.onkeydown = function(){
return false;
}
test.onkeyup = function(){
return false;
}
test.onkeypress = function(){
return false;
}
我们分别注释掉其中的两个事件，每次测试仅绑定一个事件。
很明显我们每个函数都返回false,如果返回值可以阻止事件默认动作，那么文本框将无法输入任何内容。
看下面我测试的结果，注意红的部分。
最后我分别把事件绑定两次，每次返回false看是否能阻止默认动作。
还是用了一个a标记测试onclick 返回false 是否跳转。
可以看出浏览器表现确实不太一样，当然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
}
}
}
我们为其绑定以下事件
复制代码 代码如下:
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
}
}
}
相关文章
本文主要介绍了基于uni-app开发刻度尺组件的实现示例，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
这篇文章主要为大家详细介绍了断点续传的简单例子，前端文件提交，后端PHP文件接收,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-10-10
这篇文章主要为大家总结了JavaScript去重的11种方式，各有优缺点，文中的示例代码讲解详细，具有一定的学习价值，需要的可以根据需求合理使用2023-06-06
javascript实现的文字加密解密...2007-06-06
这篇文章主要为大家详细介绍了微信小程序map地图使用的方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-10-10
渐变显示渐变消失的特殊效果在使用中还是比较常见的，本文简单的实现了一个，大家如何需要可以参考下2013-08-08
这篇文章主要介绍了JavaScript检测浏览器是否支持CSS变量代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-04-04
这篇文章主要介绍了使用ThinkJs搭建微信中控服务的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-08-08
JS中style.display和style.visibility的区别实例说明
下面的例子说明了这种区别：在这个例子中，divContent1和divContent2隐藏的时候用的是style.display=none，这时候，后面的div会向上移动，占据已经隐藏的div的空间。divContent3和divContent4用的是style.visibility=hidden来隐藏，但是其隐藏后仍然占据原来的空间2013-03-03
js二维码生成插件jquery.qrcode.js如何自定义LOGO
介绍如何将jquery.qrcode.min.js与jquery集成到网页中,生成带LOGO的二维码,提供了修改代码以支持LOGO上传的步骤,并给出注意事项以确保二维码的识别效果2024-11-11
最新评论