Question

我正在使用jquery并创建这样的事件处理程序：

$('#some_selector a.add').live('click', function(){...});

但是，当元素具有disabled类时，我需要不执行处理程序。然后我写了以下内容来实现这个目标：

$('#some_selector a.add:not(.disabled)').live('click', function(){...});

但是我已经厌倦了观看我需要添加:not(.disabled)的所有地方，有时我会忘记添加它等等。此外，如果我有一个锚元素并且我的处理程序阻止对它执行默认操作，那么添加:not(.disabled)将导致浏览器打开下一页而不是什么都不做。

当元素满足某些条件时（比如有“禁用”类），有没有办法在处理程序执行时设置自动禁用？

Answer 1

以下是您可以做的事情：

首先，将事件处理程序绑定到.disabled元素，以防止执行其他处理程序并阻止默认操作：

$('#some_selector a.add.disabled').live('click', function(event){
    event.stopImmediatePropagation();
    event.preventDefault();
});

然后您可以像以前一样绑定其他事件处理程序。当事件处理程序按绑定的顺序执行时，disabled元素的事件处理程序将始终首先执行并阻止其他处理程序执行（通过stopImmediatePropagation ^[docs]）。

Answer 2

您可以使用<button>代替<a>。设置了<button>的disabled attribute根本不会对点击做出响应：

禁用的表单控件必须防止在元素上调度在用户交互任务源上排队的任何click个事件。

您可以设置<button>的样式，以便以您想要的任何方式显示。