一、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+, Safari
xmlHttp = new XMLHttpRequest();
} catch (e) {
// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert("您的浏览器不支持AJAX！");
return false;
}
}
}
return xmlHttp;
}
浏览器有两种内核，IE内核和firefox内核；因此需要根据当前用户浏览器进行判断；
XMLHttpRequest有一些常用属性：
(1)readyState:请求的状态；（4 表示已经响应完毕）
(2)onreadystatechange：readyState改变时调用，通常用于回调函数的返回值；
(3)responseText：返回纯文本对象；
(4)responseXML：返回XML数据的对象；
(5)status：返回当前HTTP的状态（200为正常）
XMLHttpRequest的常用函数：
(1)open("GET/POST","url");: 创建请求，指定是post还是get，并且指定发送的目的地URL；
(2)send(param);:发送请求，通常param=null;
知识回顾：
(1)document.getElementById("name").innerHTML可以设定此控件的值；
(2)onblur事件表示失去焦点时调用；
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"); }}
相关推荐
本文章向大家分享基于jQuery实现的Ajax 验证用户名是否存在的实现代码，需要的码农朋友可以参考一下本文的源代码。 jQuery.ajax概述 HTTP 请求加载远程数据。 通过jQuery 底层 AJAX 实现。简单易用的高层实现见 $....
AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。 AJAX 是一种用于创建快速动态网页的技术。其核心是 JavaScript 对象 XMLHttpRequest。该对象在 ...
ajax的应用实例，通过实例了解ajax的流程，主要通过对象XMLHttpRequest来实现数据的异步传输，当我们在注册页面输入用户名后，会实现一个异步的数据传输来验证用户名是否存在，就想很多网站做成的那样。
很好的ajax实例 var XMLHttpReq = false; //创建XMLHttpRequest对象 function createXMLHttpRequest() { if(window.XMLHttpRequest) { //Mozilla 浏览器 XMLHttpReq = new XMLHttpRequest(); } else ...
本文实例为大家介绍了ajax验证用户名和密码的具体代码，供大家参考，具体内容如下 1.ajax主体部分 var xmlrequest; function createXMLHttpRequest(){ if(window.XMLHttpRequest){ xmlrequest=new ...
if(username==''){ //判断用户名是否为空 alert('请输入用户名！'); }else{ var xmlObj; //定义XMLHttpRequest对象 if(window.ActiveXObject){ //如果是浏览器支持ActiveXObjext则创建ActiveXObject...
var XMLHttpReq = false;... window.alert("用户名不能为空。"); document.myform.uname.focus(); return false; } else { sendRequest('login2?uname='+ uname + '&psw=' + psw); } } </script>
AJAX开发介绍 简单示例 基础知识 简单操作 [removed] var http_request = false; function send_request(url) {//初始化、指定处理函数、发送请求的函数 http_request = false; //开始初始化XMLHttpRequest对象...
场景描述：对于一个登录页面中有一个登录的表单，但是由于登录验证逻辑比较复杂，我们希望点击...通过AJAX，您的JavaScript 可使用JavaScript 的XMLHttpRequest 对象来直接与服务器进行通信。通过这个对象，您的Java
本文实例讲述了PHP+Ajax实现的博客文章添加类别... }else if(username==''){ //判断用户名是否为空 alert('请输入用户名！'); }else{ var xmlObj; //定义XMLHttpRequest对象 var urlData = "typename="+typ
6.3 本地文件的操作实例——小型留言本 96 6.3.1 留言发表模块 96 6.3.2 浏览模块 98 6.4 远程文件的操作实例 99 6.5 文件的上传与下载 99 6.5.1 文件的上传 99 6.5.2 文件的下载 100 6.6 小结 101 第7章 字符的处理...
31、java 中会存在内存泄漏吗，请简单描述。 11 32、abstract 的method 是否可同时是static,是否可同时是native，是否可同时是synchronized? 11 33、静态变量和实例变量的区别？ 11 34、是否可以从一个static 方法...
31、java 中会存在内存泄漏吗，请简单描述。 11 32、abstract 的method 是否可同时是static,是否可同时是native，是否可同时是synchronized? 11 33、静态变量和实例变量的区别？ 11 34、是否可以从一个static 方法...
2、 Ajax我们主要应用就是xmlhttprequest，回调函数实现局部刷新达道数据更新！ 4.2需求分析 Blog网站主要是实现注册用户登录、管理相关信息、博文及相关评论、查看留言、友情链接、及图片的上传和图像的播放而为...
//是否是AJAX掉用的 $this->var['inajax'] = empty($this->var['gp_inajax']) ? 0 : ($_SERVER['REQUEST_METHOD'] == ‘GET’ && $_SERVER['HTTP_X_REQUESTED_WITH'] == ‘XMLHttpRequest’ || $_SERVER['REQUEST_...