读书人

容易的jQuery回调函数

发布时间: 2012-12-20 09:53:21 作者: rapoo

简单的jQuery回调函数
jQuery回调函数简单使用

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

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

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

如果使用普通的方法,

不用回调函数的话,

会有怎么样的效果呢?

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

然后再隐藏指定内容。

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

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

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

具体的代码如下:

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

读书人网 >Web前端

热点推荐