ajaxStart和ajaxStop主要是在页面触发ajax时,呼叫其他function或程式码做处理。
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery ajaxStart() Example</title>
<script type="text/javascript"src="jquery.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function () {
$("div#divStatus").ajaxStart(function () {
$(this).html("Contacting the server");
}).ajaxStop(function () {
$(this).html("Response received.");
});
});
//function to get customer information
function requestCustomerInfo() {
//get the ID
var sId = $("input#txtCustomerId").val();
//send the request
$("div#divCustomerInfo").load("GetCustomerData.aspx?id=" + sId);
}
//]]>
</script>
</head>
<body>
<p>Enter customer ID number to retrieve information:</p>
<p>Customer ID: <input type="text" id="txtCustomerId" value="" /></p>
<p><input type="button" value="Get Customer Info" onclick="requestCustomerInfo()" /></p>
<div id="divStatus" style="color: blue"></div>
<div id="divCustomerInfo"></div>
</body>
</html
要加在$(document).ready(function(){});内
实例如下:
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery ajaxStart() Example</title>
<script type="text/javascript"src="jquery.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function () {
$("div#divStatus").ajaxStart(function () {
$(this).html("Contacting the server");
}).ajaxStop(function () {
$(this).html("Response received.");
});
});
//function to get customer information
function requestCustomerInfo() {
//get the ID
var sId = $("input#txtCustomerId").val();
//send the request
$("div#divCustomerInfo").load("GetCustomerData.aspx?id=" + sId);
}
//]]>
</script>
</head>
<body>
<p>Enter customer ID number to retrieve information:</p>
<p>Customer ID: <input type="text" id="txtCustomerId" value="" /></p>
<p><input type="button" value="Get Customer Info" onclick="requestCustomerInfo()" /></p>
<div id="divStatus" style="color: blue"></div>
<div id="divCustomerInfo"></div>
</body>
</html