Question

我有这个代码。它会在单击按钮时打开侧栏。我还添加了一个删除类函数，该函数会在单击页面的任何部分（包括侧栏本身）时删除该类。

$(function(){ 
    $("#users, #close-user").click(function(e){
        e.stopPropagation();
        $("#user-list").addClass("open");
    });
    $(document).click(function(){
            if( $("#user-list").hasClass("open") ){
            $("#user-list").removeClass("open");
        };
    });
});

如何修改此代码，以便仅当我点击侧边栏以外的任何其他元素时，侧边栏才会关闭？

Answer 1

$(document).click(function(event) {
    if ($(event.target).closest('#user-list').length) {
        $("#user-list").addClass("open");
    }else{
        $("#user-list").removeClass("open");
    }
});

您不应该使用event.stopPropagation();告诉here

首先修改单个转瞬即逝的事件似乎无害，但它带来了风险。当您改变人们期望的行为以及其他代码所依赖的行为时，您将会遇到错误。这只是时间问题。

JSFiddle

Answer 2

点击滑块栏即可stopPropagation。像这样：

$('#user-list').click(function(e){
   e.stopPropagation();
});

使用jQuery，如何在除ID之外的任何地方删除类？

2 个答案: