在jQuery中如何检查元素是否隐藏?

2021年3月26日17:06:14 发表评论 1,020 次浏览

检查元素是否为隐or不, jQuery:隐可以使用选择器。.toggle()函数用于切换元素的可见性。

语法如下:

$(element).is(":hidden");

例子:

<!DOCTYPE html>
< html lang = "en" >
  
< head >
     < meta charset = "utf-8" >
     < title >
         Jquery Hidden element Checking
     </ title >
     < style >
         h1 {
             color: green;
         }
          
         table, th, td {
             border: 1px solid black;
         }
     </ style >
     < script src =
"https://code.jquery.com/jquery-1.12.4.min.js" >
     </ script >
    
     < script type = "text/javascript" >
         $(document).ready(function() {
             $("button").click(function() {
                 $("table").toggle("slow", function() {
                     if ($("table").is(":hidden")) {
  
                         alert(" Hidden Element.");
                     } else {
                         alert("Element Visible.");
                     }
                 });
             });
         });
     </ script >
</ head >
  
< body >
     < center >
         < h1 >Geeks for Geeks</ h1 >
         < button type = "button" >
             Click!
         </ button >
         < table style = "width:60%" >
             < tr >
                 < th >Language Index</ th >
                 < th >Language Name</ th >
             </ tr >
             < tr >
                 < td >1</ td >
                 < td >C</ td >
             </ tr >
             < tr >
                 < td >2</ td >
                 < td >C++</ td >
             </ tr >
             < tr >
                 < td >3</ td >
                 < td >Java</ td >
             </ tr >
             < tr >
                 < td >4</ td >
                 < td >Python</ td >
             </ tr >
             < tr >
                 < td >5</ td >
                 < td >HTML</ td >
             </ tr >
         </ table >
     </ center >
</ body >
  
</ html >

输出如下:

点击之前:

在jQuery中如何检查元素是否隐藏?1

单击后:

在jQuery中如何检查元素是否隐藏?2
在jQuery中如何检查元素是否隐藏?3

木子山

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: