javascript - 如何禁用 div 子元素上的所有 onClick

我有一个 id 为 registerModal 的 div。我想禁用 div 中的所有“点击”事件。例如，我有以下内容:

<a id="instagram-login-btn" class="inst-btn" href="">

</a>

以及以下内容:

$('#instagram-login-btn').on('click', function (event) {

});

我试着做:

$('#registerModal').off('click', '**');

但这没有成功。还有其他方法可以禁用对子元素 div 的所有点击吗？

最佳答案

使用由于类的存在而禁用的事件委托(delegate)。

var modal = $('#registerModal');

modal.on('click', "#instagram-login-btn:not(.disabled)", function(event) {
    // the handler
});
modal.on("click", "#another_element:not(.disabled)", function(event) {
    // the handler
});

然后要禁用它们，请添加 disabled 类。

$("#registerModal *").addClass("disabled");

并删除要启用的类。

$("#registerModal *").removeClass("disabled");

这些是在所有嵌套元素上添加/删除类，但您的实际代码可以更有针对性。

另一种没有类的方法是绑定(bind)停止事件传播到嵌套元素的处理程序。

var modal = $('#registerModal');

modal.on('click', "#instagram-login-btn", function(event) {
    // the handler
});
modal.on("click", "#another_element", function(event) {
    // the handler
});

然后禁用它们，用处理程序停止冒泡

$("#registerModal *").on("click", function(event) { event.stopPropagation() });

并删除处理程序以启用。

$("#registerModal *").off("click");

同样，选择应针对实际所需的元素。

关于javascript - 如何禁用 div 子元素上的所有 onClick，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19352881/