Ajax随笔二 —— GET和POST请求

使用XHR发起异步的GET请求

演示:异步验证用户名是否已经存在
步骤: SQL => PHP => HTML
(1) 编写SQL:sohu.sql,表名:mail(….)
(2) 编写PHP:check_phone.php,接收客户端提交的phone,向客户端输出“cunzai”或“bucunzai”;使用浏览器同步请求该页面进行测试
(3) 编写HTML,编写一个注册用的表单,当phone输入域失去焦点时(inputPhone.onblur),获取用户的输入,异步提交给服务器进行验证

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 );

使用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' );

猜你喜欢

转载自blog.csdn.net/jiabin_xu/article/details/80821851