快捷導(dǎo)航

jquery中ajax學(xué)習(xí)筆記4

更新時間：2011年10月16日 23:21:44 作者：

本節(jié)主要介紹兩點(diǎn)：1.緩存問題 2.中文問題

緩存問題：
何謂緩存問題？即當(dāng)瀏覽器的輸入內(nèi)容相同，即請求的URL相同，這樣瀏覽器就會去讀緩存，兩次的內(nèi)容一樣，就不會和服務(wù)器端進(jìn)行交互。
解決方式：在請求的url中加上時間戳。
通過我的測試，IE、360兩次用戶名輸入一致時不會和服務(wù)器端交互，firefox即使兩次用戶名輸入的一樣，仍然會和服務(wù)器端交互。
即：firefox的中服務(wù)器端返回的temp值會每次加1，IE、360就不會改變。故加上時間戳在這三種瀏覽器中都不會再有緩存問題。
修改的代碼：
AJAXServer.java
緩存問題

復(fù)制代碼代碼如下:

 
//緩存問題加的測試代碼 輸入內(nèi)容不變IE、360次數(shù)不增加，firefox會增加 
Integer inte= (Integer) request.getSession().getAttribute("total"); 
int temp=0; 
if(inte==null){ 
temp=1; 
}else{ 
temp=inte.intValue()+1; 
} 
request.getSession().setAttribute("total",temp); 

在AJAXServer.java 加入以上代碼，同時out.println的時候把temp變量加進(jìn)去返回給客戶端。
這樣，如果客戶端的temp值加入，就表示客戶端和服務(wù)器端進(jìn)行了交互，否則就沒有。
verify.js

復(fù)制代碼代碼如下:

 
<!--緩存問題，用時間戳來解決--> 
//給url地址增加時間戳，騙過瀏覽器，不讀取緩存 
function convertURL(url){ 
//獲取時間戳 
var timestamp=(new Date().valueOf()); 
//將時間戳信息拼接到url上 
//url=“AJAXServer” 
if(url.indexOf("?")>=0){ 
url=url+"&t="+timestamp; 
}else{ 
url=url+"?t="+timestamp; 
} 
return url; 
} 
function verifyCache(){ 
var url="AJAXServer?name="+$("#username").val(); 
url=convertURL(url); //緩存 
$.get(url,null,function(data){ 
$("#result").html(data); 
}); 
} 

由于只是問了驗(yàn)證和介紹緩存問題，為了便于說明問題，故采用的校驗(yàn)方式是jquery封裝ajax接收服務(wù)器端文本數(shù)據(jù)。
》》》同樣，別忘記了修改ajax.html中調(diào)用的方法，名稱改為上述腳本中的verifyCache()
中文問題：
有兩種解決方式:
第一種：頁面端使用一次encodeURI，服務(wù)器端用String name=new String(old.getBytes("iso8859-1"),"UTF-8");
中文1

復(fù)制代碼代碼如下:

 
function verifychinese1{ 
var url="AJAXServer?name="+encodeURI($("#username").val()); 
url=convertURL(url); //緩存 
$.get(url,null,function(data){ 
$("#result").html(data); 
}); 
》》》在verify.js中加入上述方法，同時把 
String name=new String(old.getBytes("iso8859-1"),"UTF-8"); 

加入到AJAXServer.java類中的適當(dāng)?shù)奈恢?。比如放在PrintWriter這句代碼后面就可以。
同樣，用第一種方式時，別忘記了修改ajax.html中調(diào)用的方法，名稱改為上述腳本中的verifychinese1()
第二種：頁面端使用兩次encodeURI，服務(wù)器端用String name= URLDecoder.decode(old,"UTF-8");
中文2

復(fù)制代碼代碼如下:

 
function verifychinese2(){ 
var url="AJAXServer?name="+encodeURI(encodeURI($("#username").val())); 
url=convertURL(url); //緩存 
$.get(url,null,function(data){ 
$("#result").html(data); 
}); 
} 
》》》在verify.js中加入上述方法，同時把 
String name= URLDecoder.decode(old,"UTF-8"); 

加入到AJAXServer.java類中的適當(dāng)?shù)奈恢?。比如放在PrintWriter這句代碼后面就可以。
同樣，用第二種方式時，別忘記了修改ajax.html中調(diào)用的方法，名稱改為上述腳本中的verifychinese2()
需要源碼的可以留言。
通過幾天的學(xué)習(xí)，ajax的動態(tài)的驗(yàn)證基本有所了解，后續(xù)會根據(jù)情況增加相應(yīng)的內(nèi)容。

您可能感興趣的文章: