how to check if one element is hidden with jquery

This question already has an answer here:

How do I check if an element is hidden in jQuery? 53 answers

---

hidden is not a property of a jQuery object. Try is(':hidden')

  $('#Div1').click(function () {
        if ($("#Div2").is(':hidden')) {
            $("#Div2").show(500);
        }
        else {
            $("#Div2").hide(1000);
        }

  });

If the timings were the same you could simply use toggle() which does hide or show based on the current visibility.

  $('#Div1').click(function () {
       $("#Div2").stop().toggle(500);
  });

And as @A. Wolff suggests, to allow for multiple clicks, use stop as well to halt any existing animation in progress:

  $('#Div1').click(function () {
        if ($("#Div2").stop().is(':hidden')) {
            $("#Div2").show(500);
        }
        else {
            $("#Div2").hide(1000);
        }
  }); 

Part 2:

To hide the div when you click anywhere else on the page, listen for click on document :

eg

 $(document).click(function(){
     $("#Div2").stop().hide(1000);
 });

for this to work properly though, you cannot allow the click on div1 to propagate to document so change the first part to also use stopPropagation() on the first event argument:

  $('#Div1').click(function (e) {
        e.stopPropagation();       // stop click propagating to document click handler
        if ($("#Div2").is(':hidden')) {
            $("#Div2").show(500);
        }
        else {
            $("#Div2").hide(1000);
        }
  });

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

上一篇: jquery检查属性元素值

下一篇: 如何检查一个元素是否隐藏了jquery