jQuery回呼函數簡單使用
比如說,我們想要點擊某個按鈕後觸發事件,
先把一些指定內容給隱藏掉,
然後跳出相關資訊的對話方塊。
如果使用普通的方法,
不用回呼函數的話,
會有怎麼樣的效果呢?
效果是先彈出對話方塊再隱藏內容,
然後再隱藏指定內容。
這顯然不是我們想要的效果,
如果使用回呼函數,就可以解決這個問題。
當然,回呼函數功能遠不只這麼簡單……
具體的代碼如下:
[html]
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'MyJsp.jsp' starting page</title>
<title>test</title>
<script type="text/javascript" src="js/jQuery/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#button1").click(function(){
$("p").hide("slow");
alert("不使用回調,先彈出對話方塊再隱藏!");
})
$("#button2").click(function(){
$("p").hide("slow",function(){
alert("使用回呼函數,先隱藏再彈出對話方塊!");
});
})
})
</script>
</head>
<body>
<p>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
<br>
I love you,java.
</p>
<input id="button1" type="button" value="沒使用回呼函數!" />
<input id="button2" type="button" value="使用回呼函數!" />
</body>
</html>