当前位置: 首页 > 编程笔记 >

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

袁俊弼
2023-03-14
本文向大家介绍jQuery.show()和jQuery.hide()有什么区别?,包括了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>
 类似资料:
  • 问题内容: 两者都意味着空间,但是有什么区别吗? 问题答案: 一个是不间断空间,另一个是常规空间。不间断的空格表示该行不应在该点处换行,就像它不会在一个单词的中间换行一样。 此外,正如斯文德(Svend)在其评论中指出的那样,不间断的空间不会崩溃。

  • 本文向大家介绍<%# %> 和 <% %> 有什么区别?相关面试题,主要包含被问及<%# %> 和 <% %> 有什么区别?时的应答技巧和注意事项,需要的朋友参考一下 答:<%# %>表示绑定的数据源 <%%>是服务器端代码块  

  • 问题内容: 以下代码之间有什么区别: 和 Python建议采用一种做事方式,但有时似乎不止一种。 问题答案: 一个是函数调用,一个是文字: 使用第二种形式。它更具Python风格,并且可能更快(因为它不涉及加载和调用单独的函数)。

  • 发展至今(2020 年 6 月份),GCC 编译器已经更新至 10.1.0 版本,其功能也由最初仅能编译 C 语言,扩增至可以编译多种编程语言,其中就包括 C++ 。 除此之外,当下的 GCC 编译器还支持编译 Go、Objective-C,Objective-C ++,Fortran,Ada,D 和 BRIG(HSAIL)等程序,甚至于 GCC 6 以及之前的版本还支持编译 Java 程序。但本

  • 问题内容: 比较PMD和CheckStyle有一个问题。但是,我找不到关于PMD和FindBugs之间差异/相似性的详尽分类。我相信一个关键的区别是PMD适用于源代码,而FindBugs适用于编译的字节码文件。但是就功能而言,这应该是一个选择,还是两者相辅相成? 问题答案: 我同时使用。我认为他们是相辅相成的。 正如您所说,PMD在源代码上工作,因此会发现诸如以下问题:违反命名约定,缺少花括号,放

  • 问题内容: 我被要求在portlet和门户网站上工作。 我想知道portlet和servlet之间的区别吗? Portlet与Servlet有何不同之处(可能在功能上)? 问题答案: Portlet是JSR-168标准的一部分,该标准规范门户容器和组件。这与Web容器(和Servlet)的标准不同。尽管这两个标准之间肯定有很强的相似之处,但是它们在容器,API,生命周期,配置,部署等方面有所不同。