您好,欢迎访问一九零五行业门户网

jQuery使用ajaxStart()和ajaxStop()方法

ajaxstart()和ajaxstop()方法是绑定ajax事件。ajaxstart()方法用于在ajax请求发出前触发函数,ajaxstop()方法用于在ajax请求完成后触发函数。它们的调用格式为:
$(selector).ajaxstart(function())和$(selector).ajaxstop(function())
其中,两个方法中括号都是绑定的函数,当发送ajax请求前执行ajaxstart()方法绑定的函数,请求成功后,执行ajaxstop ()方法绑定的函数。
例如,在调用ajax()方法请求服务器数据前,使用动画显示正在加载中,当请求成功后,该动画自动隐藏,如下图所示:
在浏览器中显示的效果:
从图中可以看出,由于使用ajaxstart()和ajaxstop()方法绑定了动画元素,因此,在开始发送ajax请求时,元素显示,请求完成时,动画元素自动隐藏。
注意:该方法在1.8.2下使用是正常的
<!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>使用ajaxstart()和ajaxstop()方法</title> <script src="http://libs.baidu.com/ jquery /1.8.2/jquery.js" type="text/ javascript "></script> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <p id="ptest"> <p class="title"> <span class="fl">加载一段文字</span> <span class="fr"> <input id="btnshow" type="button" value="加载" /> </span> </p> <ul> <li id="pload"></li> </ul> </p> <script type="text/javascript"> $(function () { $("#pload").ajaxstart(function(){ $(this).html("正在请求数据..."); }); $("#pload").ajaxstop(function(){ $(this).html("数据请求完成!"); }); $("#btnshow").bind("click", function () { var $this = $(this); $.ajax({ url: "http://www.imooc.com/data/info_f.php", datatype: "json", success: function (data) { $this.attr("disabled", "true"); $("ul").append("<li>我的名字叫:" + data.name + "</li>"); $("ul").append("<li>男朋友对我说:" + data.say + "</li>"); } }); }) }); </script> </body> </html>
以上就是jquery使用ajaxstart()和ajaxstop()方法的详细内容。
其它类似信息

推荐信息