首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > XML SOAP >

XMLHttpRequest Ajax 范例检查用户名是否存在

2013-01-23 
XMLHttpRequest Ajax 实例检查用户名是否存在一、XMLHttpRequest 对象的方法与属性方 法描 述abort()停止当

XMLHttpRequest Ajax 实例检查用户名是否存在

一、XMLHttpRequest 对象的方法与属性

方 法

描 述

abort()

停止当前请求

getAllResponseHeaders()

把HTTP请求的所有响应首部作为键/值对返回

getResponseHeader("header")

返回指定首部的串值

open("method", "url")

建立对服务器的调用。method参数可以是GET、POST或PUT。url参数可以是相对URL或绝对URL。这个方法还包括3个可选的参数

send(content)

向服务器发送请求

setRequestHeader("header", "value")

把指定首部设置为所提供的值。在设置任何首部之前必须先调用open()

?

?

属 性

描 述

onreadystatechange

每个状态改变时都会触发这个事件处理器,通常会调用一个JavaScript函数

readyState

请求的状态。有5个可取值:0 = 未初始化,1 = 正在加载,2 = 已加载,3 = 交互中,4 = 完成

responseText

服务器的响应,表示为一个串

responseXML

服务器的响应,表示为XML。这个对象可以解析为一个DOM对象

status

服务器的HTTP状态码(200对应OK,404对应Not Found(未找到),等等)

statusText

HTTP状态码的相应文本(OK或Not Found(未找到)等等)


js/xmlHttpRequest.js

function createXmlHttpRequest() {var xmlHttp;try {// Firefox, Opera 8.0+, SafarixmlHttp = new XMLHttpRequest();} catch (e) {// Internet Explorertry {xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {try {xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");} catch (e) {alert("您的浏览器不支持AJAX!");return false;}}}return xmlHttp;}

?

jsp文件:

<head><script type="text/javascript" src="js/xmlHttpRequest.js"></script>  </head>    <body>    <script type="text/javascript">function userNameCheck()   {       var username = document.all.username.value;        //获得text的值             var request = createXmlHttpRequest();//创建request 对象       request.open("post","UserAction?username="+username);//建立到服务器的新请求       request.send();//向服务器发送请求             request.onreadystatechange=function()//指定当readyState属性改变时的事件处理句柄       {           if (request.readyState==4)//提取当前HTTP的就绪状态,状态4表示:响应已完成,可以访问服务器响应并使用它              if (request.status==200)//HTTP状态,我们期望的状态码是 200,它表示一切顺利。              //如果就绪状态是 4 而且状态码是 200,就可以处理服务器的数据了,而且这些数据应该就是要求的数据                 {                    var value = request.responseText;//服务器返回响应文本                                       if (value=="true")                    {                        document.all.unc.innerHTML="该用户名已存在";                    }                    else                    {                         document.all.unc.innerHTML="OK";                    }                 }       }              }  </script>用户姓名: <input type="text" name="username" onblur="userNameCheck()"/><font color="red" size="-1" id="unc"></font>   </body></html>
public class UserAction extends HttpServlet {  public void doGet(HttpServletRequest request, HttpServletResponse response)   throws ServletException, IOException {  doPost(request, response); }  public void doPost(HttpServletRequest request, HttpServletResponse response)   throws ServletException, IOException {   String username=request.getParameter("username");          if(username.equals("chenlh"))           response.getWriter().print("true");       else        response.getWriter().print("false");  }} 
?

热点排行