Ajax實現的異步傳輸與驗證示例代碼

它可以讓你不離開頁面的情況下，獲取后臺你想要的數據，并顯示在當前頁面！！好的，下面看個例子

下面是一段Ajax驗證代碼
代碼如下:

<script type="text/javascript"> 
//① 設置變量 
var xmlHttp ; 
var flag = false ; 
var package_name; 
//② 創建XMLHttp對象 
function createXMLHttp(){ 
if(window.XMLHttpRequest){ 
xmlHttp = new XMLHttpRequest() ; 

} else { 
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ; 
} 
} 
//③ 
function getPackage_name(package_name){ 
//創建XMLHttpRequest對象 
createXMLHttp() ; 
document.getElementById("msg").innerHTML=package_name; 
//創建一個HTTP請求，以post方式將package_name交給AppInfoServlet 
xmlHttp.open("post","AppInfoOneServlet?package_name="+package_name) ; 

//調用回調函數 生成可視化的頁面響應 
xmlHttp.onreadystatechange =checkCallback; 
// 發送請求 
xmlHttp.send(null) ; 
//友好提示 
document.getElementById("msg").innerHTML = "正在獲取信息，請耐心等候..." ; 
} 
//④ 回調函數 
function checkCallback(){ 
if(xmlHttp.readyState == 4){ 
if(xmlHttp.status == 200){ 
var text = xmlHttp.responseText ; 
var t=text.split('|');//當獲取的是多個值，并用"|"作為分割時 
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應用截圖展示</h3>"+"</div>"+"</div>"+"<center><a href='"+t[3]+"' target='_blank'><img src='./images/downloadsoruce.png'></a></center>" ; 
//獲取的數據在id為“msg” 的標記中顯示出來，例如：<span id="msg"></span> 
} 
} 
} 
</script> 
 
在jsp頁面中是這樣調用js函數的 
 代碼如下:

<a href="#bottom" onclick="getPackage_name('<%=ainfo.getPackage_name() %>')">獲取</a> 
 
Ajax獲取的數據將在下列標記中顯示出來 
 代碼如下:

<span id="msg"></span> 
 
好的，我們來看一下servlet中的代碼： 
 代碼如下:

public void doPost(HttpServletRequest request, HttpServletResponse response) 
throws ServletException, IOException { 
request.setCharacterEncoding("utf-8"); 
response.setCharacterEncoding("utf-8");//必須在out前，否則傳輸的漢子為亂碼啊 
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()); 
} 
 
以上已經很清楚啦，當然驗證用戶是否存在，道理和這個是一模一樣的，其中一定要注意漢字傳輸中亂碼的問題~~~~~~
 
 




聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com