Question

当用户点击按钮时... div向下滑动...

$(document).ready(function(){
    $("#friend_requests_container").click(function(){
        $("#friend_requests").slideDown(500);
    });
});

但是，我想要做的是当用户点击页面上的任何其他位置时，div会向上滑动，除非他们点击按钮以显示div。

我试过的是这个。

$(document).ready(function(){
    $("#friend_requests_container").click(function(){
        $("#friend_requests").slideDown(500);
    }, function(){
        $("#friend_requests").fadeOut(500);
    });
});

但这似乎不起作用...... 有任何想法吗？谢谢:)）

Answer 1

您需要two点击一次friend_requests_container个事件，点击document点击其他事件，当点击friend_requests_container时事件为propagated至document click你需要使用stopPropagation()

<强> Live Demo

$(document).ready(function(){
    $("#friend_requests_container").click(function(event){     
        $("#friend_requests").slideDown(500);
                 event.stopPropagation();             
    });

    $(document).click(function(event){
        $("#friend_requests").slideUp(500);
         event.stopPropagation();      
    });   
});

Answer 2

您可以在文档中附加事件并检查所单击元素的ID

$(document).ready(function(){
    $("#friend_requests_container").click(function(){
        $("#friend_requests").slideDown(500);
    });

    $(document).click(function(e){
        if(e.target.id !== "friend_requests_container") {
           $("#friend_requests").slideUp(500);
        }
    });
});

Div滑回不起作用

2 个答案: