javascript - jQuery 停止调用其他处理程序

Question

假设我有标签并且我将两个点击事件附加到它:

$('#l1').bind('click',function(){
 alert('label clicked');
}
$('#l2').bind('click',function(){
 alert('label2 clicked');
}
$('#l3').bind('click',function(){
 alert('label3 clicked');
}

$('label').bind('click',function(){
 if($(this).hasClass('disabled')
return false
}
<label id='l1'>hi</label>
<label id='l2' class="disabled">bye</label>
<label id='l3'>hi</label>

现在我不希望在单击具有 disabled 类的标签时显示警报。有可能吗？

注意:alert 只是一个虚拟的东西。我正在执行一组 Action 而不是那个。每个 Action 都基于实际标签而不同

Answer 1

如果多个事件处理程序绑定(bind)到同一个事件的同一个元素，则处理程序将按照它们绑定(bind)的顺序被调用。如果您调用 event.stopImmediatePropagation()在特定处理程序中，它将停止调用后续处理程序。

所以修改你的$('label').bind()如下:

$('label').bind('click',function(event){
   if($(this).hasClass('disabled') {
      event.stopImmediatePropagation();
      return false;
   }
}

并将其移至其他 .bind() 调用之上。然后该特定处理程序将首先执行，并有机会阻止其他处理程序执行。

(请注意 .stopImmediatePropagation() 与 .stopPropagation() ] 不同 - 后者停止事件在 DOM 树中冒泡，但不会停止同一元素上的其他处理程序。)