jQuery.show()和jQuery.hide()有什么区别?

jQueryshow()方法

show(speed,[callback])方法使用优美的动画显示所有匹配的元素,并在完成后触发可选的回调。

这是此方法使用的所有参数的描述-

  • 速度 -代表三个预定义速度(“慢”,“正常”或“快”)之一或运行动画的毫秒数(例如1000)的字符串。

  • callback- 这是可选参数,表示动画完成后要调用的函数。

示例

您可以尝试运行以下代码来学习如何使用show()方法:

<html>

   <head>

      <title>The jQuery Example</title>

      <script src = "https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

       

      <script>

   

         $(document).ready(function() {

            $("#show").click(function () {

               $(".mydiv").show( 100 );

            });

            $("#hide").click(function () {

               $(".mydiv").hide( 100 );

            });

               

         });

      </script>

       

      <style>

         .mydiv {

             margin:10px;

             padding:12px;

             border:2px solid #666;

             width:100px;

             height:100px;

         }

      </style>

   </head>

   

   <body>

   

      <div class = "mydiv">

         This is a SQUARE.

      </div>

      <input id = "hide" type = "button" value = "Hide" />  

      <input id = "show" type = "button" value = "Show" />  

   </body>

   

</html>

jQueryhide()方法

hide(speed,[callback])方法使用优美的动画隐藏所有匹配的元素,并在完成后触发可选的回调。

这是此方法使用的所有参数的描述-

速度 -代表三个预定义速度(“慢”,“正常”或“快”)之一或运行动画的毫秒数(例如1000)的字符串。

callback- 这是可选参数,表示动画完成后要调用的函数。

示例

您可以尝试运行以下代码来学习如何使用hide()方法:

<html>

   <head>

      <title>The jQuery Example</title>

      <script src = "https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

       

      <script>

   

         $(document).ready(function() {

            $("#show").click(function () {

               $(".mydiv").show( 200 );

            });

            $("#hide").click(function () {

               $(".mydiv").hide( 200 );

            });

               

         });

      </script>

       

      <style>

         .mydiv {

             margin:20px;

             padding:20px;

             border:4px solid #666;

             width:100px;

             height:100px;

         }

      </style>

   </head>

   

   <body>

   

      <div class = "mydiv">

         This is a SQUARE.

      </div>

      <input id = "hide" type = "button" value = "Hide" />  

      <input id = "show" type = "button" value = "Show" />  

   </body>

</html>

以上是 jQuery.show()和jQuery.hide()有什么区别? 的全部内容, 来源链接: utcz.com/z/359599.html

回到顶部