Question

我正在尝试在点击事件期间在元素上添加一个类，然后如果我点击其他任何地方，我希望删除该类。问题是一切都在同时发射并引发问题。仅仅是一个FYI，我这样做是一个移动修复，因为我正在设置的网站的方式。这是我的代码：

$('ul > li:has(.sub-menu) a').click(function(e){
    e.preventDefault();
    $('li.clicked_link').on('click', function(){
        var this_link = $(this).attr('href');
        document.location.href=this_link;
    });
    $('body').on('click',function(){
        $('li.clicked_link').removeClass('clicked_link');
    });
    $(this).parent().addClass('clicked_link');
});

基本上，我在点击锚点时向父类添加一个类。我也正在停用该锚点的链接。问题是看起来它正在触发事件并立即添加和删除类（我猜，因为什么都没发生）。我认为，由于事情的顺序，这不会发生，但事实并非如此。

Answer 1

这是因为你有嵌套的事件处理程序，每次你点击一个匹配的锚时，一个新的事件处理程序被添加到LI和正文中，你只是继续打桩。

此外，主体上的事件处理程序始终触发并删除链接，因为单击锚点会向主体冒泡，因此首先锚点上的事件处理程序触发并添加类，然后它会冒泡到正文并删除班级

$('ul > li:has(.sub-menu) a').click(function(e){
    e.preventDefault();
    e.stopPropagation();
    $(this).parent().addClass('clicked_link');
});

$(document).on('click',function(e){
    if ( $(e.target).closest('.clicked_link').length ) {

        window.location.href = this.href;

    } else {

        $('li.clicked_link').removeClass('clicked_link');

    }
});

删除第二次单击事件（jQuery）上的类

1 个答案: