js如何定义一个字符串长度第一关： HTML(3)、CSS((6)

XHR对象的成员属性：

readyState: 0，表示XHR的当前状态，即请求-响应过程进行到哪一步，可取值有5个，只能依次递增不能回退，自动改变不能手工赋值：

0 - UNSENT 请求消息尚未发送

1 - OPENED 已打开到服务器的连接

2 - HEADERS_RECEIVED XHR已接收到响应消息起始行和头部

3 - LOADING XHR正在响应消息的主体

4 - DONE XHR已经接收完成响应消息

status: 0, 响应消息状态码，只有xhr.readyState变为2后才有值

statusText:""，响应消息中原因短句，只有xhr.readyState变为2后才有值

responseText: ""，响应消息的主体内容，当xhr.readyState变为3开始有值，变为4值稳定下来

4.使用XHR发起异步的GET请求

演示：异步验证用户名是否已经存在

步骤： SQL => PHP => HTML

(1)编写SQL：sohu.sql，表名：mail(....) 15:43

(2)编写PHP：check_phone.php，接收客户端提交的phone，向客户端输出“cunzai”或“bucunzai”；使用浏览器同步请求该页面进行测试

(3)编写HTML，编写一个注册用的表单，当phone输入域失去焦点时(inputPhone.onblur)，获取用户的输入，异步提交给服务器进行验证

//1 //2 //3 //4

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function(){

if(xhr.readyState===4){

if(xhr.status===200){

doResponse(xhr);

}else {

alert(‘响应完成但有问题‘);

}

}

}

xhr.open(‘GET‘, ‘x.php?k=v&k=v‘, true);

xhr.send( null );

5.使用XHR发起异步的POST请求

注意：由于XHR对象发送POST请求时默认的Content-Type请求头为text/plain，PHP服务器会拒接接收请求数据，必须在请求消息发送之前进行修改！

//1 var xhr = new XMLHttpRequest();

//2 xhr.onreadystatechange = function(){ }

//3 xhr.open(‘POST‘, ‘x.php‘, true);

//3.5 在请求主体发送之前修改请求头部Content-Type

xhr.setRequestHeader(‘Content-Type‘, ‘application/x-www-form-urlencoded‘);

//4 xhr.send( ‘k=v&k=v‘ );

练习：实现用户异步登录

(1)编写SQL：sohu.sql，表mail(....)

(2)编写PHP：mail_login.php，接收客户端提交的phone、pwd，执行查询，若都正确，向客户端输出succ；若无法查询到记录，向客户端输出err SELECT * FROM mail WHERE phone=‘‘ AND pwd=‘‘

(3)编写HTML：mail_login.html，登录按钮，点击后弹出一个登录“模态对话框”，输入电话和密码，点击提交可以实现异步信息登录验证，若响应消息是err，则在输入框上方提示“用户名或密码错误”；若响应消息是succ，则隐藏对话框，登录按钮处显示为“欢迎回来：XXX”

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/jisuanjixue/article-79238-6.html