0

我在页面上有许多可点击的元素，在加载资源之前不应启用这些元素。我的想法是用一个.disabled类初始化按钮，然后在资源准备好时将其删除。同时，我将在.disabledclick 事件上有一个处理程序，以防止将事件传播到其他处理程序。

问题是，即使我.disabled先添加了处理程序，我也无法在其他点击处理程序之前触发它。

$( "body" ).on('click','.disabled', function(e) {
        alert('disabled');
        e.stopImmediatePropagation();
        return false;
});
$('.clickable').click(function(e) {
     alert('enabled');   
});
// Call this when ready:
//$('.clickable').removeClass('disabled');

小提琴：http : //jsfiddle.net/4rJxU/7/

这将首先弹出一个“启用”警报，然后是一个“禁用”警报，大概是因为委托事件被.clickable元素的父级捕获，因此稍后处理？

如何使用委托事件禁用点击处理程序？

4

2 回答 2

1

添加将保持实际状态的变量不是更好吗？

var isLoaded = false;

$( "body" ).on('click', function(e) {
    if (isLoaded) {
        alert('enabled');   
    } else {
        alert('disabled');
        e.stopImmediatePropagation();
        return false;
    }
});

然后将其更改为true一切准备就绪。

于 2013-10-17T17:08:10.493 回答
1

这应该有效（不需要禁用类）：

var clickEnabled = false;

$('.clickable').on('click', function(e) {
    if (!clickEnabled) {
        alert('disabled');
        e.stopImmediatePropagation();
        return false;
    }
    else {
        alert('enabled');
    }
});

...一旦您需要的一切准备就绪，只需将 clickEnabled 设置为 true。

小提琴：http: //jsfiddle.net/ehFGX/

如果您只想在一切准备就绪后触发默认单击处理程序，您可以删除上面的 else 块，如果您的处理程序不返回 false，它将继续使用默认值。

如果您仍然喜欢使用禁用的类，您可以只检查 $(this) 是否具有该类，而不是检查 !clickEnabled。

于 2013-10-17T17:17:56.637 回答