听说code能改变world，所以就学了

jquery API Ajax(1)

分类：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>
View Code

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 })
View Code

.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 });
View Code

 DEMO

 

posted @ 2014-03-12 22:17  李腾  阅读(340)  评论(0)  编辑  收藏  举报

如果我加了黑链呢：http://liteng.org