Question

我为具有id和类选择器的几个元素点击事件处理程序：

$(function() {
    $("#cancelOrderLink").click(function() {
        if (confirm("If you continue, all items will be removed " +
            "from your cart. This action cannot be undone. Continue " +
            "and empty cart?"))
            $("form#clearCartForm").submit();
    });

    $(".updateItemLink").click(function(){
        $(this).closest("form").submit();
    })
});

但是，我想添加逻辑以防止在元素具有特定类名时触发这些处理程序：

$(function() {
    $(".superUser").click(function() {
        $("#message").html("This action is not allowed when acting as a Super User.<br />");

        return false;
    });
});

如何使用第二个代码段覆盖第一个代码段中的处理程序？

Answer 1

将event.stopPropagation();添加到您的代码中：

$(".superUser").click(function(e) {
   e.stopPropagation();
   ...

或者，如果元素相等，并且您没有任何其他click侦听器，则取消绑定前一个方法：

$(".superUser").unbind('click').click(function() {

如果要在运行时为特定ID而不是类名绑定事件，请使用：

$("#cancelOrderLink").not('.superuser').click(function() {

Answer 2

您可以使用.not()过滤器。

$(function() {
    $("#cancelOrderLink").not(".superUser").click(function() {
        if (confirm("If you continue, all items will be removed " +
            "from your cart. This action cannot be undone. Continue " +
            "and empty cart?"))
            $("form#clearCartForm").submit();
    });
});

Answer 3

我建议使用“return false”而不是e.stopPropagation（）。这是一种更加简单的方法来阻止传播并防止默认。例如：

$("#yourclass").click(function(){
return flase;
});

如何使用类选择器覆盖id选择器的jQuery事件处理程序？

3 个答案: