快捷導(dǎo)航

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

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

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

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

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

 
//緩存問(wèn)題加的測(cè)試代碼 輸入內(nèi)容不變IE、360次數(shù)不增加，firefox會(huì)增加 
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 加入以上代碼，同時(shí)out.println的時(shí)候把temp變量加進(jìn)去返回給客戶端。
這樣，如果客戶端的temp值加入，就表示客戶端和服務(wù)器端進(jìn)行了交互，否則就沒(méi)有。
verify.js

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

 
<!--緩存問(wèn)題，用時(shí)間戳來(lái)解決--> 
//給url地址增加時(shí)間戳，騙過(guò)瀏覽器，不讀取緩存 
function convertURL(url){ 
//獲取時(shí)間戳 
var timestamp=(new Date().valueOf()); 
//將時(shí)間戳信息拼接到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); 
}); 
} 

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

加入到AJAXServer.java類(lèi)中的適當(dāng)?shù)奈恢谩１热绶旁赑rintWriter這句代碼后面就可以。
同樣，用第一種方式時(shí)，別忘記了修改ajax.html中調(diào)用的方法，名稱(chēng)改為上述腳本中的verifychinese1()
第二種：頁(yè)面端使用兩次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中加入上述方法，同時(shí)把 
String name= URLDecoder.decode(old,"UTF-8"); 

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

您可能感興趣的文章: