jQuery非同步請求Ajax應用$.load的使用

jquery對ajax的封裝了三層：

第一層：$.ajax，第二層：.load $.get，$.post，第三層：$.getScript，$.getJson

先來學習.load的使用：

格式：load(url [,data] [,callback]) 

 

 

最簡單的get方式擷取常值內容

代碼如下	複製代碼
$('#ajax').click(function () {     $('#box').load('ddd.html');//將ddd.html的內容載入到id=box的元素中去 }); $('#ajax').click(function () {     $('#box').load('ddd.html .url');//將ddd.html中class=url的內容載入到id=box的元素中去 });

與伺服器段指令碼互動

代碼如下	複製代碼
$('#ajax').click(function () {     $('#box').load('test.php?url=aitiblog');//get方式提交到test的php檔案 });

與伺服器的複雜互動：

代碼如下

複製代碼

$('#ajax').click(function () {     $('#box').load('test.php', {url : 'www.111cn.net'}, function (response, status, xhr) {//post方式提交到test的php檔案         console.log(response);//返回的資料         console.log(status);//返回的狀態 success和error         console.log(xhr);         //返回的xhr對象包括：         // xhr.responseText=>相當於response，         // xhr.responseXML=>返回的xml資料，         // xhr.status=>返回的狀態代碼200、400、401、404、500         // xhr.statusText=>對狀態代碼的解釋     }); });

在網上查到了一些說這個load函數有一個不好的地方是會產生緩衝，這樣當你的載入的檔案有改動時，它不會即時的去顯示

不過有三種方法：
 
1.如果是html檔案的話 
 

代碼如下	複製代碼
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">       <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">       <META HTTP-EQUIV="Expires" CONTENT="0">

如果是php檔案，則加入

代碼如下	複製代碼
<?php  header("Cache-Control: no-cache, must-revalidate");  ?>    $.ajaxSetup ({      cache: false //關閉AJAX相應的緩衝  });

3.改檔案名稱，改成其它的檔案名稱，這樣會重新的去讀！

代碼如下	複製代碼
$('#ajax').click(function () {     $('#box').load('ddd.html?'+Math.random()); }

這樣我們利用了 Math.random()函數來給頁面帶參數，這樣也不會有緩衝這個問題了哦。