分类:Ajax
.ajaxComplete()
1.当Ajax请求完成后注册一个回调函数。这是一个 AjaxEvent。
HTML示例代码
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>jquery学习</title> 6 <script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script> 7 <script src="js/custom.js"></script> 8 <link type="text/css" rel="stylesheet" href="css/style.css"/> 9 </head> 10 <body> 11 <div class="wrap"> 12 <h1>hello ajax</h1> 13 <h2>.ajaxComplete()</h2> 14 <p>每当一个ajax请求完成时会触发ajaxComplete事件,在这个时间点所有处理函数会使用.ajaxComplete()方法注册并执行。</p> 15 <button type="button" class="trigger-binding">trigger-binding</button> 16 <button type="button" class="trigger-nobinding">trigger-nobinding</button> 17 <div class="result"></div> 18 <div class="result2"></div> 19 <div class="log"></div> 20 <div class="msg"></div> 21 <h2>.ajaxError()</h2> 22 23 24 <button type="button" class="ajaxError">ajaxError</button> 25 <div class="lesson2-result"> 26 </div> 27 <div class="lesson2-msg"></div> 28 </div> 29 </body> 30 </html>
js代码
1 $(document).ready(function(){ 2 //alert("hello jquery!"); 3 $(".trigger-binding").click(function(){ 4 $(".result").load("text.html"); 5 }); 6 $(".trigger-nobinding").click(function(){ 7 $(".result2").load("text2.html"); 8 }); 9 //1.ajax执行之后会执行ajaxComplete()函数 10 /*********注意从jquery1.8之后ajaxComplete只能绑定document*****/ 11 $(document).ajaxComplete(function(){ 12 $(".log").text("Ajax执行了!"); 13 14 }); 15 //2.区分不同的请求 16 //使参数传递给这个处理函数通过事件对象XMLHttpRequest对象和设置对象中的请求,来做每一次ajaxComplete处理执行的 17 //限制我们的回调到只处理某一特定的URL 18 $(document).ajaxComplete(function(event,xhr,settings){ 19 if(settings.url=="text.html"){ 20 $(".log").text("Ajax执行了!"+xhr.responseHTML); 21 } 22 }); 23 //当ajax请求完成后显示一个信息(当执行完一个ajax函数就执行) 24 $(document).ajaxComplete(function(event,request,settings){ 25 $(".msg").append("<p>ajax请求完了!</p>"); 26 }); 27 //其他注意事项 28 //当$global=false;调用$.ajax()或者$.ajaxSetup(),$ajxComplete()方法将不会触发 29 })
.ajaxError()
Ajax请求出错时注册一个回调处理函数,这是一个 Ajax Event。
js代码
1 $(document).ready(function(){ 2 /**************.ajxError()***************/ 3 $(".ajaxError").click(function(){ 4 $(".lesson2-result").load('text3.html'); 5 }); 6 7 $(document).ajaxError(function(){ 8 $(".lesson2-msg").text("Error!"); 9 }); 10 //区分执行出错的文件 11 //其实括号里面的参数也可以写成(event,xhr,setting) 12 $(document).ajaxError(function(event,xhr,settings,exception){ 13 if(settings.url=='text3.html'){ 14 $(".lesson2-msg").text("this text3.html file nofinde!"); 15 } 16 }); 17 //其他注意事项 18 //当$global=false;调用$.ajax()或者$.ajaxSetup(),$ajxComplete()方法将不会触发 19 //当ajax请求失败时显示一个信息 20 $(document).ajaxError(function(event,xhr, settings){ 21 $(".lesson2-msg").innerHtml("<p>Error requesting"+settings.url+"</p>"); 22 }); 23 });