Ajax異步傳輸用得很廣，就拿web開(kāi)發(fā)來(lái)說(shuō)吧，當(dāng)用戶(hù)注冊(cè)時(shí)，當(dāng)用戶(hù)剛一輸完，怎么立即判斷用戶(hù)是否存在，并在輸入框后顯示提示？這就用到了異步傳輸~~
它可以讓你不離開(kāi)頁(yè)面的情況下，獲取后臺(tái)你想要的數(shù)據(jù)，并顯示在當(dāng)前頁(yè)面??！好的，下面看個(gè)例子
下面是一段Ajax驗(yàn)證代碼
復(fù)制代碼 代碼如下:
script type="text/javascript">
//① 設(shè)置變量
var xmlHttp ;
var flag = false ;
var package_name;
//② 創(chuàng)建XMLHttp對(duì)象
function createXMLHttp(){
if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest() ;
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
}
}
//③
function getPackage_name(package_name){
//創(chuàng)建XMLHttpRequest對(duì)象
createXMLHttp() ;
document.getElementById("msg").innerHTML=package_name;
//創(chuàng)建一個(gè)HTTP請(qǐng)求，以post方式將package_name交給AppInfoServlet
xmlHttp.open("post","AppInfoOneServlet?package_name="+package_name) ;
//調(diào)用回調(diào)函數(shù) 生成可視化的頁(yè)面響應(yīng)
xmlHttp.onreadystatechange =checkCallback;
// 發(fā)送請(qǐng)求
xmlHttp.send(null) ;
//友好提示
document.getElementById("msg").innerHTML = "正在獲取信息，請(qǐng)耐心等候..." ;
}
//④ 回調(diào)函數(shù)
function checkCallback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
var text = xmlHttp.responseText ;
var t=text.split('|');//當(dāng)獲取的是多個(gè)值，并用"|"作為分割時(shí)
document.getElementById("msg").innerHTML =t[0]+ "br>"+"div id='container'>"+"div id='content'>"+"div id='slider'>"+"ul>"+"li>"+"img src='"+t[1]+"' alt='Css Template Preview' />"+"/li>"+"li>"+"img src='"+t[2]+"' alt='Css Template Preview' />"+"/li>"+"/ul>"+"/div>"+"h3>Android應(yīng)用截圖展示/h3>"+"/div>"+"/div>"+"center>a href='"+t[3]+"' target='_blank'>img src='./images/downloadsoruce.png'>/a>/center>" ;
//獲取的數(shù)據(jù)在id為“msg” 的標(biāo)記中顯示出來(lái)，例如：span id="msg">/span>
}
}
}
/script>
在jsp頁(yè)面中是這樣調(diào)用js函數(shù)的
復(fù)制代碼 代碼如下:
a href="#bottom" onclick="getPackage_name('%=ainfo.getPackage_name() %>')">獲取/a>
Ajax獲取的數(shù)據(jù)將在下列標(biāo)記中顯示出來(lái)
復(fù)制代碼 代碼如下:
span id="msg">/span>
好的，我們來(lái)看一下servlet中的代碼：
復(fù)制代碼 代碼如下:
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");//必須在out前，否則傳輸?shù)臐h子為亂碼啊
PrintWriter out = response.getWriter();
String package_name=request.getParameter("package_name");
AppDaoImpl adi=new AppDaoImpl();
AppInfo ainfo=new AppInfo();
ainfo=adi.getOneAppInfo(package_name);
out.print(ainfo.getDescription()+"|"+ainfo.getScreen_1_path()+"|"+ainfo.getScreen_2_path()+"|"+ainfo.getDownload_path());
}
以上已經(jīng)很清楚啦，當(dāng)然驗(yàn)證用戶(hù)是否存在，道理和這個(gè)是一模一樣的，其中一定要注意漢字傳輸中亂碼的問(wèn)題~~~~~~
您可能感興趣的文章:- yii2 modal彈窗之ActiveForm ajax表單異步驗(yàn)證
- Ajax實(shí)現(xiàn)異步用戶(hù)名驗(yàn)證功能
- Ajax異步方式實(shí)現(xiàn)登錄與驗(yàn)證
- Ajax實(shí)現(xiàn)異步刷新驗(yàn)證用戶(hù)名是否已存在的具體方法
- ajax jquery 異步表單驗(yàn)證示例代碼
- PHP+Ajax異步通訊實(shí)現(xiàn)用戶(hù)名郵箱驗(yàn)證是否已注冊(cè)( 2種方法實(shí)現(xiàn))
- jquery ajax 登錄驗(yàn)證實(shí)現(xiàn)代碼
- jquery+ajax驗(yàn)證不通過(guò)也提交表單問(wèn)題處理
- Ajax 用戶(hù)名驗(yàn)證是否存在
- ajax同步驗(yàn)證單號(hào)是否存在的方法
