 |
||||||||
 |
|
|||||||
 
|
||||||||
 |
您现在的位置： 极品网 >> 电脑学院 >> 编程开发 >> 编程综合 >> 教程正文 |
|
||||||||||||||||||||||
|
||||||||||||||||||||||
|
|||||
| AJAX编写用户注册实例及技术小结(1) | |||||
| 作者：佚名 教程来源：不详 点击数： 更新时间：2008-1-14 | |||||
|
我所举的这个例子是一个企业用户注册时的一个应用，当用户注册时检查用户名和企业名是否可用，以前的做法是在旁边加一个按钮，点击“检查”，就向服务器发出请求，然后等待……服务器返回信息，继续操作。 如果我们用Ajax技术来实现以上的操作则不必等待服务器返回信息，用户输入用户名或企业名称的时候，当输入文本框失去焦点的时候，则会自动向服务器发出请求，用户继续做下面的操作，不必点击“检查”，也不必等待服务器返回信息，检查与用户操作是异步的，可同时进行。当服务器信息返回的时候，会自动在面页相应位置显示返回信息，不必刷新页面，相当于局部刷新的效果。 下面我们来看代码吧。 2＜script language="javascript" type="text/javascript"＞ 3＜!-- 4/**//**Ajax 开始 by Alpha 2005-12-31*/ 5 6 var http = getHTTPObject(); 7 8 function handleHttpResponse(){ 9 if(http.readyState == 4){ 10 if(http.status == 200){ 11 var xmlDocument = http.responseXML; 12 if(http.responseText!=""){ 13 document.getElementById("showStr").style.display = ""; 14 document.getElementById("userName").style.background= "#FF0000"; 15 document.getElementById("showStr").innerText = http.responseText; 16 }else{ 17 document.getElementById("userName").style.background= "#FFFFFF"; 18 document.getElementById("showStr").style.display = "none"; 19 } 20 21 } 22 else{ 23 alert("你所请求的页面发生异常，可能会影响你浏览该页的信息！"); 24 alert(http.status); 25 } 26 } 27 } 28 29 function handleHttpResponse1(){ 30 if(http.readyState == 4){ 31 if(http.status == 200){ 32 var xmlDocument = http.responseXML; 33 if(http.responseText!=""){ 34 document.getElementById("comNmStr").style.display = ""; 35 document.getElementById("comNm").style.background= "#FF0000"; 36 document.getElementById("comNmStr").innerText = http.responseText; 37 }else{ 38 document.getElementById("comNm").style.background= "#FFFFFF"; 39 document.getElementById("comNmStr").style.display = "none"; 40 } 41 42 } 43 else{ 44 alert("你所请求的页面发生异常，可能会影响你浏览该页的信息！"); 45 alert(http.status); 46 } 47 } 48 } 49 50 function chkUser(){ 51 var url = "/chkUserAndCom"; 52 var name = document.getElementById("userName").value; 53 url += ("&userName="+name+"&oprate=chkUser"); 54 http.open("GET",url,true); 55 http.onreadystatechange = handleHttpResponse; 56 http.send(null); 57 return ; 58 } 59 function chkComNm(){ 60 var url = "/chkUserAndCom"; 61 var name = document.getElementById("comNm").value; 62 url += ("&comName="+name+"&oprate=chkCom"); 63 http.open("GET",url,true); 64 http.onreadystatechange = handleHttpResponse1; 65 http.send(null); 66 return ; 67 } 68 69 //该函数可以创建我们需要的XMLHttpRequest对象 70 function getHTTPObject(){ 71 var xmlhttp = false; 72 if(window.XMLHttpRequest){ 73 xmlhttp = new XMLHttpRequest(); 74 if(xmlhttp.overrideMimeType){ 75 xmlhttp.overrideMimeType('text/xml'); 76 } 77 } 78 else{ 79 try{ 80 xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 81 }catch(e){ 82 try{ 83 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 84 }catch(E){ 85 xmlhttp = false; 86 } 87 } 88 } 89 return xmlhttp; 90 } 91/**//**Ajax 结束*/ 92 93//检测表单 94function chkpassword() 95{ 96 var m=document.form1; 97 if(len(m.password.value) ＞ 20 || len(m.passwo |
|||||
|
|||||
| 教程录入：admin 责任编辑：admin | |||||
| 【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】 | |||||
| 最新热点 | 最新推荐 | 相关教程 | ||
| Java,javascript,JScrip javascript和Java区别 Java技巧（一）：会变色的超 javascript和Java的区别 javascript调用JAVA javascript 和 Java 的区 JavaServerPages白皮书 JavaApplet实例:水波 javascript与JavaApplet javascript与Java在浏览 |
 网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！） |
