Question

我创建了以下脚本：

$(".clickme").click(function () {
    var isVisible = $(".slide-div").is(":visible");
    $(".slide-div:visible").stop().slideUp(400);

    if (!isVisible) {
        $(".slide-div").slideDown(400);
    }           
});

该脚本运行良好，现在我尝试通过slide-div外部的单击来扩展脚本。因此，当我在div外面点击时，它也会向上滑动。我尝试使用以下功能，但这不起作用。

$(":not(.slide-div)").click(function () {
    if ($(".slide-div").is(":visible");) {
        $(".slide-div:visible").stop().slideUp(400);
    }
});

Answer 1

怎么样：

$(document).on('click', 'body', function (e) {

    var clicked_slideDiv = $(e.target).closest('.slide-div').length > 0,
        isClickme = $(e.target).is('.clickme'),
        isVisible = $(".slide-div").is(":visible");

    if(isVisible && (isClickme || !clicked_slideDiv)) { 
        $(".slide-div").stop().slideUp(400);
    } else if (!isVisible && isClickme) {
        $(".slide-div").slideDown(400);
    }
});

您可以将body与任何想要缩小“div 之外的”的selektor切换到。

jQuery单击SlideUp / Down脚本

1 个答案: