首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

容易的jQuery回调函数

2012-12-20 
简单的jQuery回调函数jQuery回调函数简单使用比如说,我们想要点击某个按钮后触发事件,先把一些指定内容给

简单的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>  

热点排行