如何检查元素可见

Question

我怎么知道我的element可见或不使用javascript。我使用$('#element').hide();，$('#element').show();来显示或隐藏的元素。我如何检查element是否显示？元素在模态中。我试图改变这不是在模态元素和它的工作，但是当我把元素的模式里面它不工作..

我尝试使用此代码，但它不工作。

<div class="well me"> 
     <label for="majore">Major Exam</label> 
      <div class="input-group"> 
       <input type="text" class="form-control majore" id="majore" oninput="total();"/> 
      <span class="input-group-addon"> 
       <i class="fa fa-percent"></i> 
      </span> 
       </div> 
    </div> 

    <script> 
      if ($('.me').is(':visible')) {       
        mt = m/100 * 50 + 50; 
       } 
    </script> 

Answer 1

"none" == document.getElementById("element").style.display //Check for hide 

"block" == document.getElementById("element").style.display //Check for show 

您可以像使用也

if ($('#element').css('display') == 'none') { 
    alert('element is hidden'); 
} 

Answer 2

检查显示：无|块]，忽略可见：[真|虚假]

$('#element').is(":visible"); 

Answer 3

看来你选择器是错误的。的下面$("[element]").is(":visible")

实施例：（做参考）

$("#show").on("click", function() { 
 
    $("#text").show(); 
 
}) 
 
$("#hide").on("click", function() { 
 
    $("#text").hide(); 
 
}) 
 
$("#getStatus").on("click", function() { 
 
    alert($("#text").is(":visible")); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="text">Hello</div> 
 
<button id="show">Show</button> 
 
<button id="hide">Hide</button> 
 
<button id="getStatus">Get Status</button>

Answer 4

$('.me')是一类选择器将返回的elements其中元件具有me类array。

所以，你需要使用this或使用index定位的特定div无论是作为可以有很多elements具有相同class name。

$('.me').is(':visible')这将检查的第一个元素，并根据第一元素的可见性返回结果。

您可以尝试

$(".me").eq(1).is(':visible') //Here 1 is index of div which can vary 

OR

$(this).is(':visible') 

Answer 5

您可以检查以下提及链接：可见选择。

https://api.jquery.com/visible-selector/ http://www.w3schools.com/jquery/sel_visible.asp

同时检查W3Schools的例子。 。