很多時候，我們都要判斷元素當前是否處于顯示或隱藏狀態。Jquery通過判斷元素display屬性狀態值來實現“判斷當前操作元素是否顯示還是隱藏”，實現方法主要使用Jquery提供的基本選擇器 :visible 或 :hidden方法。

點擊下面的“運行”按鈕，在打開的頁面中可多次點擊右上角按鈕，查看效果：

<style type="text/css"> .run-button{width:100px; height:38px;display:block;position:absolute;right:70%; top:200px;} .test{ width:100px; height:100px; color:#000; border:1px blue solid;} .tips{color:#f00;} </style><script type="text/javascript"> $(function(){$(".run-button").focus().click(function(){if($('.test').is(':visible')){$('.test').hide().next().text('注意:div被隱藏了！');}else{$('.test').show().next().text('div顯示，能看見');} //用基本選擇器 :hidden 也行 // if($('.test').is(':hidden')){ // $('.test').show().next().text('div顯示，能看見'); // }else{ // $('.test').hide().next().text('注意:div被隱藏了！'); // }})}) </script> <p style="padding:8px 0;">說明：多次點擊右上角按鈕，使div層在顯示 、隱藏兩者狀態間自由切換 </p> <p><input type="button" value="點擊測試" class="run-button"/> </p> <div class="test">該div默認顯示 </div> <p><span class="tips">注意：div當前顯隱藏狀態</span> </p>
當然也可以通過jq讀取CSS樣式中的display值來判斷當前display屬性狀態值,但還是推薦使用上面的方法！

總結

以上是生活随笔為你收集整理的Jquery判断元素是否隐藏：display属性状态值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。