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

我想隐藏一个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>

---

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();
});

---

所以，当你点击标题时，你想链接隐藏。 但是当你点击其他任何地方时，你希望标题隐藏？ 如果是这样，您可以指定Title mouseup事件，然后隐藏该链接，然后使用e.stopPropagation()以绕过使用this时附加到窗口的全局mouseup 。 这里是一个演示：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();
    }
});

链接地址: http://www.djcxy.com/p/83647.html

上一篇: hide div when clicking outside the container with jquery

下一篇: In jQuery, how to attach events to dynamic html elements?