Ajax 使用ajax加上get和post方法，通过后台加载数据，并在网页上进行显示

//第一个参数，使用的什么方法。

//第二个参数url，这里因为是get请求，所以url后面是要跟上参数的！！！

//第三个参数，同步还是异步，true同步，false异步,默认异步

// xhr.open(“get”,“checkUsername.php?username=”+username,true);

xhr.open(“post”,“checkUsername.php”,true);

//

//对于post请求，参数应该放到请求体当中

var param = “username=” + username

//设置xhr请求头信息，这个步骤仅仅是针对于post请求才有的！！！

xhr.setRequestHeader(“Conte 《一线大厂Java面试题解析+后端开发学习笔记+最新架构讲解视频+实战项目源码讲义》无偿开源 威信搜索公众号【编程进阶路】 nt-type”,“application/x-www-form-urlencoded”);

xhr.send(param);

//

xhr.onreadystatechange = function(){

//readyState等于4代表的是xhr的完成相应

if(xhr.readyState == 4){

//status等于200，代表正常

if(xhr.status == 200){

//除了responseText还有xhr.responseXML,就是不同的格式。

var result = xhr.responseText;

console.log(result);

document.getElementById(“result”).innerText = result;

}

}

};

};

};

注册界面

用户名：

密码：

对readyState和status的解释：

另一个不变，checkUsername.php

<?php $username = $_POST["username"]; //这里应该查询数据库，这里只是一个模拟数据库 if($username == 'zhangsan'){ echo "username exists"; }else{ echo "username OK"; } ?>

这里解释以下，第2步骤，准备发送阶段的open方法中的服务端地址如何确定，一般开发人员会提供一份接口文档,里面会详细的告诉你地址参数什么的。

[](()4.使用Ajax完成唯一性案例操作

==============================================================================

话不多说，直接上代码。

创作一个register.html文件，内容如下：

注册界面

用户名：

邮箱：

手机号码：

再准备三个服务器php文件，

checkEmail.php：

<?php $email = $_POST["e"]; if ($email == 'xxx@qq.com') { echo '1'; }else{ echo '0'; } ?>

checkPhone.php文件：

<?php $phone = $_POST["phonenumber"]; if ($phone == '139') { echo '{"status":1,"message":"手机号已经被使用"}'; }else{ echo '{"status":0,"message":{"tips":"手机号可用","phonefrom":"中国电信"}}'; } ?>