jquery slidetoggle如何设置如果鼠标单击其他，关闭slidetoggle答案

【问题标题】：jquery slidetoggle how to set if mouse click other, close slidetogglejquery slidetoggle如何设置如果鼠标单击其他，关闭slidetoggle
【发布时间】：2014-12-28 03:29:40
【问题描述】：

我使用 jquery slidetoggle 来显示一个 DIV

但如果鼠标点击不在div.list 中，我需要设置关闭此幻灯片切换

$( "#list_button" ).click(function() {
        $( ".list" ).slideToggle( "fast" );
 });

我只发现如果 mouseout.... 如果单击任何“页面上的任何位置”以关闭此切换，我找不到如何设置

用于测试：http://jsfiddle.net/sdgwbyv8/

【问题讨论】：

标签： javascript jquery slidetoggle

【解决方案1】：

$( "body" ).click(function( event ) {

    if(
        event.target.className!='list' && event.target.parentNode.parentNode.className!="list"

    ) {
         $( ".list" ).slideToggle('fast');
    }
});

演示：http://jsfiddle.net/sdgwbyv8/9/ 一种可能的解决方案，我想还有更好的解决方案....

【讨论】：

【解决方案2】：

您可以通过event.stopPropagation()：

$("#list_button").click(function (event) {
    if ($(".list").is(":hidden")) {
        event.stopPropagation();
        $(".list").slideToggle("fast");
    } 
});

$('body').click(function () {
    $(".list").hide();
});
$(".list").click(function (event) {
    event.stopPropagation();
});

Working Fiddle

【讨论】：