Question

我想在点击它时隐藏div。为此我有这个完美的代码：

var box3=$(".despcnt");
box3.mouseup(function () {
    return false;
});

$(this).mouseup(function (a) {
    if(!($(a.target).parent(".despcnt").length>0)){
        box3.removeClass("dino");box3.hide()
    }
});

但我想从课堂上排除。 Despcnt一个具有类desplcnt的链接，所以当点击书房外面或关闭相同的链接时......没试过把它放在那里不起作用。

有什么想法吗？

HTML

<a class="desplcnt" href="#">Link</a>
<div class="despcnt">
    <ul>
        <li><a data-value="1" href="#">Title</a></li>
    </ul>
</div>

Answer 1

var $despcnt = $(".despcnt");

/* Hide the popup whereas clicking outside */
$(document).on("click", function() {
  $despcnt.hide();
});

/* Don't hide the popup whereas clicking inside */
$despcnt.on("click", function(evt) {
    evt.stopPropagation();
});

Answer 2

因此，当您点击标题时，您需要隐藏链接。但是当你点击其他任何地方时，你想要隐藏标题？如果是这样，您可以指定Title mouseup个事件，然后从那里隐藏链接，然后使用e.stopPropagation()以绕过附加到窗口的全局mouseup使用this。这是一个演示：http://jsfiddle.net/pUnvR/1/

以下是代码：

HTML

<a class="desplcnt" href="#">Link</a>
<div class="despcnt">
 <ul>
    <li><a data-value="1" href="#">Title</a></li>
 </ul>
</div>

JS

var box3=$(".despcnt");
box3.mouseup(function (e) {
    $(".desplcnt").hide();
    e.stopPropagation();
});

$(this).mouseup(function (a) {
    if(!($(a.target).parent(".despcnt").length>0)){
        box3.removeClass("dino");
        box3.hide();
    }
});

使用jquery在容器外部单击时隐藏div

2 个答案: