cho*_*bo2 30 javascript jquery dom event-delegation
我试图阻止一些事件,但stopPropagation不适用于"live",所以我不知道该怎么做.我在他们的网站上发现了这个.
直播活动不会以传统方式冒泡,也无法使用stopPropagation或stopImmediatePropagation停止.例如,假设有两个点击事件 - 一个绑定到"li",另一个绑定到"li a".如果内部锚点发生咔嗒声,将触发BOTH事件.这是因为当$("li").bind("click",fn); 您实际上是在说"只要在LI元素上发生click事件 - 或者在LI元素内部 - 触发此单击事件." 要停止对直播事件的进一步处理,fn必须返回false
它说fn必须返回false,所以我试图做
$('.MoreAppointments').live('click', function(e) {
alert("Hi");
return false;
});
Run Code Online (Sandbox Code Playgroud)
但这没有用,所以我不知道如何让它返回false.
更新
这是一些更多的信息.
我有一个表格单元格,我将点击事件绑定到它.
$('#CalendarBody .DateBox').click(function(e)
{
AddApointment(this);
});
Run Code Online (Sandbox Code Playgroud)
所以AddApointment只是做了一些ui对话框.
现在,实时代码(MoreAppointments)位于此表格单元格中,基本上是一个锚标记.因此,当我点击锚标签时,它首先转到上面的代码(addApointment - 所以首先运行该事件)运行但不启动我的对话框,而是直接进入(MoreAppointment)事件并运行该代码.该代码运行后,它将从"addApointment"启动对话框.
更新2
这是一些HTML.我没有复制整个表格,因为它有点大,所有单元格都用相同的数据重复.如果需要,我会发布它.
<td id="c_12012009" class="DateBox">
<div class="DateLabel">
1</div>
<div class="appointmentContainer">
<a class="appointments">Fkafkafk fakfka kf414<br />
</a><a class="appointments">Fkafkafk fakfka kf414<br />
</a><a class="appointments">Fkafkafk fakfka kf414<br />
</a><a class="appointments">Fkafkafk fakfka kf414<br />
</a><a class="appointments">Fkafkafk fakfka kf414<br />
</a>
</div>
<div class="appointmentOverflowContainer">
<div>
<a class="MoreAppointments">+1 More</a></div>
</div>
</td>
Run Code Online (Sandbox Code Playgroud)
Sho*_*og9 52
简短的回答很简单,你做不到.
通常,您可以阻止事件从"冒泡"到外部元素上的事件处理程序,因为首先调用内部元素的处理程序.但是,jQuery的"实时事件"通过将所需事件的代理处理程序附加到文档元素,然后在事件冒泡文档后调用适当的用户定义处理程序来工作.
冒泡插图http://shog9.com/so_1967537_bubbling.png
这通常使"实时"绑定成为绑定事件的一种相当有效的方法,但它有两个很大的副作用:首先,附加到内部元素的任何事件处理程序都可以防止"实时"事件为自己或其任何子项触发; 第二,"实时"事件处理程序无法阻止任何直接附加到文档子项的事件处理程序被触发.您可以停止进一步处理,但是您无法对已经发生的处理做任何事情......当您的实时事件触发时,已经调用了直接附加到子项的处理程序.
这里你最好的选择(据我所知,你发布的内容)是对两个点击处理程序使用实时绑定.完成后,您应该能够return false从.MoreAppointments处理程序中阻止调用.DateBox处理程序.
$('.MoreAppointments').live('click', function(e)
{
alert("Hi");
return false; // prevent additional live handlers from firing
});
// use live binding to allow the above handler to preempt
$('#CalendarBody .DateBox').live('click', function(e)
{
AddApointment(this);
});
Run Code Online (Sandbox Code Playgroud)
我已经使用过这样的代码,它对我有用:
$('#some-link').live('click', function(e) {
alert("Link clicked 1");
e.stopImmediatePropagation();
});
$('#some-link').live('click', function(e) {
alert("Link clicked 2");
});
Run Code Online (Sandbox Code Playgroud)
所以,在我看来,现在JQuery支持使用直播事件的stopImmediatePropagation
也许你可以检查一个a元素上没有发生click事件:
$('#CalendarBody .DateBox').click(function(e) {
// if the event target is an <a> don't process:
if ($(e.target).is('a')) return;
AddApointment(this);
});
Run Code Online (Sandbox Code Playgroud)
可能会工作吗?