在JavaScript事件处理中,为什么“return false”或“event.preventDefault()”和“停止事件流”会有所不同?
据说当我们处理“click事件”时,返回false或调用event.preventDefault()会产生影响,其中
不同之处在于preventDefault只会阻止默认事件操作发生,即链接点击,表单提交等页面重定向,返回false也会阻止事件流。
这是否意味着,如果click事件已针对多个操作多次注册,请使用
$('#clickme').click(function() { … })
return false会阻止其他处理程序运行吗?
我现在在Mac上,所以只能使用Firefox和Chrome而不是IE,它有不同的事件模型,并通过添加3个处理程序在FF和Chrome上进行测试,并且所有3个处理程序都没有停止运行…. 那么真正的区别是什么,或者,是否存在“阻止事件流动”的情况?
这与…有关
使用jQuery的animate(),如果点击的元素是“ ”,该函数应该仍然返回false?
和
e.preventDefault()之间的区别是什么? 并返回false?
希望这段代码可以解释给你…
HTML
jQuery的
$('div').click(function(){ alert('I am from '); }); $('a.a1').click(function(){ alert('I am from '); return false; // this will produce one alert }); $('a.a2').click(function(e){ alert('I am from '); e.preventDefault(); // this will produce two alerts });
演示
要么
$('div').click(function(){ alert('I am from '); }); $('a').click(function(){ alert('I am from '); }); $('a.a1').click(function(){ alert('I am from '); return false; }); $('a.a2').click(function(e){ alert('I am from '); e.preventDefault(); });
演示2
写入return false
或e.preventDefault()
不会阻止其他处理程序运行。
相反,它们会阻止浏览器的默认反应,例如导航到链接。
在jQuery中,您可以编写e.stopImmediatePropagation()
以防止其他处理程序运行。
return false
和preventDefault()
用于阻止浏览器与事件关联的默认操作(例如,单击链接后的链接)。 对于三种不同的场景,有一种不同的技术可以实现这一目标:
1.使用addEventListener()
(非IE浏览器)添加的事件处理程序 。 在这种情况下,请使用Event
对象的preventDefault()
方法。 该活动的其他处理程序仍将被调用。
function handleEvent(evt) { evt.preventDefault(); }
2.使用attachEvent()
(IE)添加的事件处理程序 。 在这种情况下,将window.event
的returnValue
属性设置为true
。 该事件的其他处理程序仍将被调用,并且还可能更改此属性。
function handleEvent() { window.event.returnValue = false; }
3.使用属性或事件处理程序属性添加的事件处理程序 。
要么
button.onclick = handleEvent;
在这种情况下, return false
将完成这项工作。 仍将调用通过addEventListener()
或attachEvent()
添加的任何其他事件处理程序。
function handleEvent() { return false; }
有时,事件监听器想要取消对事件的副作用感兴趣。想象一下你希望只允许数字的文本框。 因为文本框可以接受任何内容,所以有必要告诉浏览器忽略键入的非数字。 这是通过监听键事件并在键入错误键时返回false来实现的。
这并没有完全回答你的问题,但有一天我在元素上使用YUI的
e.preventDefault()
来e.preventDefault()
href
动作,因为我只希望JavaScript onclick
事件能够控制(除非没有检测到JS) 。 在这种情况下,停止整个事件链不会影响我。
但是在那之前的几天,我有一个嵌套在
元素中,我不得不在事件处理程序中使用条件来确定被点击的目标是否是标签,因为它们都没有
e.preventDefault()
和e.stopEvent()
停止了我的’click’事件( 合法地 )触发两次(IE6除外)。
本来不错的是能够压制整个相关事件链,因为我已经尝试过传播并return false ;
,但是由于我的标签元素,我总是会得到第二次事件。
编辑:我不介意知道jquery如何处理我的双重事件情况,如果有人热衷于评论。