function jqAjaxTest() { var jqRequestUrl = "AjaxHandler.ashx"; $.post(jqRequestUrl + "?action=jquery", { userName: "jeff wong", location: "beijing" }, jqPostCallBack, "text"); } //AJAX 请求开始时执行函数 $("#divResult").ajaxStop(function() { $(this).append("<br/>请求已经结束了<br/>"); }); function jqPostCallBack(oData) { //在div中显示所有数据 $("#divResult").append(oData); $("#divResult").css("display", "block"); $("#divResult").css("color", "red"); }
6、ajaxSuccess(callback)
AJAX 请求成功时执行函数。Ajax 事件。
XMLHttpRequest 对象和设置作为参数传递给回调函数。
返回值 jQuery
参数
callback (Function) : 待执行函数
示例
function jqAjaxTest() { var jqRequestUrl = "AjaxHandler.ashx"; $.post(jqRequestUrl + "?action=jquery", { userName: "jeff wong", location: "beijing" }, jqPostCallBack, "text"); } //AJAX 请求成功时执行函数 $("#divResult").ajaxSuccess(function(evt, request, settings) { $(this).append("<br/>请求成功<br/>"); $(this).append(settings.url); }); function jqPostCallBack(oData) { //在div中显示所有数据 $("#divResult").append(oData); $("#divResult").css("display", "block"); $("#divResult").css("color", "red"); }
三、其他
1、jQuery.ajaxSetup(options)
设置全局 AJAX 默认选项。
参数见 '$.ajax' 说明。
返回值 jQuery
参数
options (可选) : 选项设置。所有设置项均为可选设置。
示例
//设置 AJAX 请求默认地址为 "AjaxHandler.ashx"，禁止触发全局 AJAX 事件，用 POST 代替默认 GET 方法。其后的 AJAX 请求不再设置任何选项参数。 $.ajaxSetup({ url: "AjaxHandler.ashx", global: false, type: "POST" });
2、serialize()
序列化表单内容为字符串。
返回值 jQuery
参数
序列化表单内容为字符串，用于 Ajax 请求。
示例
$(document).ready(function() { var oSerializedStr = $("form").serialize(); //序列化表单内容为字符串 $("#results").append("<tt>" + oSerializedStr + "</tt>"); });
文档片段：
<body> <p> <b>Results: </b> </p> <form> <select> <option>Single</option> <option>Single2</option> </select> <select multiple="multiple"> <option selected="selected">Multiple</option> <option>Multiple2</option> <option selected="selected">Multiple3</option> </select><br /> <input type="checkbox" value="check1" /> check1 <input type="checkbox" value="check2" checked="checked" /> check2 <input type="radio" value="radio1" checked="checked" /> radio1 <input type="radio" value="radio2" /> radio2 </form> <script src="https://www.jb51.net/js/jQTest.js" type="text/javascript"></script> </body>
3、serializeArray()
序列化表单内容，返回 JSON 数据结构数据。
返回值 jQuery
参数
序列化表单内容为JSON ，用于 Ajax 请求。
示例
$(document).ready(function() { var fields = $("select, :radio").serializeArray(); //序列化表单select和raido为json jQuery.each(fields, function(i, field) { $("#results").append(field.value + " "); }); });
好了，关于jQuery的ajax就介绍到这里，笔者的每个示例都测试通过了。jQuery封装好的ajax函数用起来确实方便，有了这样的“神兵利器”，以后写ajax的应用程序肯定会更加得心应手。