代码学堂(uxuew.cn)提供付费解决PHP WEB开发等技术服务,如果需要请 点击加我QQ:1662935793.
>web前端 > ajax技巧 > 使用Ajax技术通过XMLHttpRequest对象完成首页登录功能

使用Ajax技术通过XMLHttpRequest对象完成首页登录功能

ajax技巧 围观2918次 更新日期:2017-06-25 16:33:09 留下足迹

最近使用Ajax技术通过XMLHttpRequest对象完成一个首页的登录功能!

代码如下:

  1. <script> 
  2. function createXMLHttpRequest() {​ 
  3.     if (window.XMLHttpRequest) { 
  4.         return xmlhttprequest = new XMLHttpRequest(); 
  5.     } else { 
  6.         return xmlhttprequest = new ActiveXObject("Microsoft.XMLHTTP"); 
  7.     } 
  8. //登录按钮执行的方法 
  9. function doStart() { 
  10.     var logname = document.getElementById("loginName").value; 
  11.     var logpass = document.getElementById("loginPsw").value; 
  12.     var userinfo = "inAccount=" + logname + "&inPsw=" + logpass; 
  13.     var url = "users/users_pswCheck.action"
  14.     xmlhttprequest = createXMLHttpRequest(); 
  15.     xmlhttprequest.onreadystatechange = getresultValue; 
  16.     xmlhttprequest.open("post", url, true); 
  17.     xmlhttprequest.setRequestHeader("Content-Type""application/x-www-form-urlencoded"); 
  18.     xmlhttprequest.send(userinfo); 
  19. //回调方法 
  20. function getresultValue() { 
  21.     if (xmlhttprequest.readyState == 4 && xmlhttprequest.status == 200) { 
  22.         var result = xmlhttprequest.responseText; 
  23.         if (result == "success") { 
  24.             window.location.href = "index.jsp"rel = "external nofollow"
  25.         } else { 
  26.             document.getElementById("xiaoxi").innerHTML = "登录失败!"
  27.         } 
  28.     } 
  29. //页面的按键事件,即当按的是回车键时触发该事件 
  30. function keybutton() { 
  31.     if (event.keyCode == 13) { 
  32.         doStart(); 
  33.         return
  34.     } 
  35. </script> 

转载请注明:代码学堂>web前端 > ajax技巧 > 使用Ajax技术通过XMLHttpRequest对象完成首页登录功能

喜欢 (904) or 分享 (216)
随机文章