jquery toggleClass只能运行一次

Gho*_*cho 5 javascript jquery toggleclass

当你通过添加类来点击<div>另一个时,这个脚本就是这样做的.一旦有了这个类,点击任意位置(除了将删除该类,因此隐藏它.所以你点击查看一个弹出div,然后点击任何地方,但该div应该隐藏它.<div>log_in_box_dd#big_ul_hide#big_ul_hide#big_ul_hide

这一切都有效,但只有一次.之后,它变得非常奇怪.
添加然后删除后,检查元素将会读取<div id="big_ul_hide" class="">.我不能让课程重新添加.

我添加了该setTimeout函数,因此在.lin_und单击时不会立即删除该类.

那么,为什么不让我重新加入课程呢?如果我alert(...)之后.toggleclass它会每次都提醒,但仍然不适用于该课程.

小提琴:http://jsfiddle.net/NQxAC/

<script>
$('.lin_und').click(function() {
    $('#big_ul_hide').toggleClass('log_in_box_dd');
});
setTimeout(function() {      
    $('html').click(function() {
        if($('#big_ul_hide').hasClass('log_in_box_dd')) {
            $('#big_ul_hide').removeClass('log_in_box_dd');
        }
    });
    $('#big_ul_hide').click(function(event) {
        event.stopPropagation();
    });
}, 2000);
</script>
Run Code Online (Sandbox Code Playgroud)

j08*_*691 3

您需要首先停止事件冒泡,并将单击事件处理程序html从内部单击处理程序中移出,以便它存在自己的一个(否则您将重复绑定单击事件)。尝试使用:

$('.lin_und').click(function (e) {
    e.stopPropagation();
    $('#big_ul_hide').toggleClass('log_in_box_dd');
    $('#big_ul_hide').click(function (event) {
        event.stopPropagation();
    });
});
$('html').click(function () {
    $('#big_ul_hide').removeClass('log_in_box_dd');
});
Run Code Online (Sandbox Code Playgroud)

jsFiddle 示例