ajax頁面異步加載的使用


使用ajax非常簡單,通常有兩種方法:(一般見第一種使用情況最多,也比較方便)

1.JQuery下的ajax調用

function()

{

.ajax({

type:"POST",   //不同元素使用逗號隔開

url:http://www.baidu.com/Home/Index

data:{userName:"Danny",password:"123"},

success:function(){

...請求成功

}

error:function(){

...請求失敗

}

})

2.普通javascript實現

(1)GET

var xmlhttp;

if (window.XMLHttpRequest)

{ // IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執行代碼

xmlhttp=new XMLHttpRequest();

}

else {

// IE6, IE5 瀏覽器執行代碼

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

xmlhttp.open("GET","baidu.com?name=1&pwd=123",true);
xmlhttp.send();

(2)POST

xmlhttp.open("POST","baidu.com",true);

//如果需要像 HTML 表單那樣 POST 數據,請使用 setRequestHeader() 來添加 HTTP 頭

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send("fname=Henry&lname=Ford");

 

我們使用接口調用后端數據時,可能會得到瀏覽器緩存的結果,而不是發出新的請求,因為服務器緩存了請求的到的數據。(在使用ajax分頁時,ajax只執行一次,請求到數據后,再點擊不訪問接口,原來是緩存的問題)

如果我們需要為每一次請求得到新的數據,可以通過給鏈接加一個時間戳或隨機數來解決。url:"baidu.com/Home/Index?t="+Math.random(); 或者加一個請求時間。

(這就是我們經常見到請求加隨機數的原因,在使用qq登錄時,請求鏈接就加了隨機數。當初不明白為什么加隨機數,原來是為了使每次請求鏈接不同,防止瀏覽器直接訪問緩存數據)

除了時間戳、隨機數改變鏈接外,ajax可以使用cache:false來保證獲得新數據。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM