您的位置: 首页  >  IT文章  >  容易的jQuery回调函数

容易的jQuery回调函数

分类: IT文章 • 2023-03-05 15:31:15
简单的jQuery回调函数

jQuery回调函数简单使用

比如说，我们想要点击某个按钮后触发事件，

先把一些指定内容给隐藏掉，

然后跳出相关信息的对话框。

如果使用普通的方法，

不用回调函数的话，

会有怎么样的效果呢？

效果是先弹出对话框再隐藏内容，

然后再隐藏指定内容。

这显然不是我们想要的效果，

如果使用回调函数，就可以解决这个问题。

当然，回调函数功能远不只这么简单……

具体的代码如下：

[html] view plaincopyprint?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2.   
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  4. <html>  
  5.     <head>  
  6.        
  7.         <title>My JSP 'MyJsp.jsp' starting page</title>  
  8.         <title>test</title>  
  9.         <script type="text/javascript" src="js/jQuery/jquery-1.4.4.min.js"></script>  
  10.         <script type="text/javascript">  
  11.            $(document).ready(function(){  
  12.                 $("#button1").click(function(){  
  13.                     $("p").hide("slow");  
  14.                      alert("不使用回调，先弹出对话框再隐藏！");  
  15.                 })  
  16.                 $("#button2").click(function(){  
  17.                     $("p").hide("slow",function(){  
  18.                         alert("使用回调函数，先隐藏再弹出对话框!");  
  19.                     });          
  20.                 })  
  21.             })  
  22.         </script>  
  23.     </head>  
  24.     <body>  
  25.         <p>  
  26.             I love you,java.  
  27.             <br>  
  28.             I love you,java.  
  29.             <br>  
  30.             I love you,java.  
  31.             <br>  
  32.             I love you,java.  
  33.             <br>  
  34.             I love you,java.  
  35.             <br>  
  36.             I love you,java.  
  37.             <br>  
  38.             I love you,java.  
  39.             <br>  
  40.             I love you,java.  
  41.             <br>  
  42.             I love you,java.  
  43.             <br>  
  44.             I love you,java.  
  45.             <br>  
  46.             I love you,java.  
  47.             <br>  
  48.             I love you,java.  
  49.             <br>  
  50.             I love you,java.  
  51.         </p>  
  52.         <input id="button1" type="button" value="没使用回调函数!" />  
  53.         <input id="button2" type="button" value="使用回调函数!" />  
  54.     </body>  
  55. </html>  

相关推荐