开发者学堂课程【Ajax 前端开发入门与实战：案例03_验证手机唯一性】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/595/detail/8527
案例03_验证手机唯一性
目录：
一、手机验证码相关功能开发
二、功能测试
一、手机验证码相关功能开发
现在还剩最后一个功能，手机号码微信的一个校验，接下来就把这个功能实现出来。
打开 Sublime ,实现代码之前首先，先把下面这段代码折叠起来。不然的这部分代码可能混淆视听。因为非常有可能在这部分直接写一些相关的代码，这个肯定是不对的。
所有要养成一个良好的习惯，当写了一个比较完整的程序之后，要把它折叠起来。
45 Var emailValue ‘’’
...
70 };
折叠之后就很清晰的知道代码该从下一部分开始写，就不会写的 function 内去了。
所有一定要注意一下写代码要养成好的习惯。
接下来就该对 phone 相关事件进行监听，这个事件是什么？依然是 onblur。
Phone.onblur = function(){};
相关的代码结构写完之后在回来把大括号打开，再继续写代码。这是一个比较好的代码习惯。
Phone.onblur = function(){
};
在 onblur 中将做两件事情，第一件事情是拿到用户所输入的手机号码，接着第二个事情是和服务器进行相关请求。服务器请求可以做单独的封装，减少代码量,后面的课程会进行相关的讲解。
Phone.onblur = function(){
Var phoneValue = phone.value;
// 1 2 3 4
Var xhr = null;
If(window.XMLHttpRequest){
xhr = new XMHLttpRequest();
} else {
xhr = new ActiveX0bject(‘’Microsoft.XMLHTTP’’)；
}
xhr.open(‘’post ’’,’’./server/checkphone.php’’,true);
//这两个相关函数是已经固定了的。
//相关的接口文档会有
Var params = ‘’phoneumber=’’+phoneValue;
//key 相关参数
xhr.setReqestHeader(‘’Content-Type’’,’’applicaton/x-www-form-urlencoded’’);
xhr,send(params);
xhr.onreadystatechange = function(){
If(xhr.readyState == 4){
If(xhr.status == 200){
//xhr.responseText就是一个字符
var result = xhr.responseText;
//希望将result这样的一个字符串转化为对象
//方便我们获取里面的一些值
result = JSON.parse(result);
var phone.sesult = document.querySelector(‘’#phone_result’’);
If(result.status == 0) {
//代表手机号可用
Phone_result.innerText = result.message.tips + ‘’,’’ + result.message.
Phonefrom;
}else if(result.status == 1 ){
//代表手机号不可用
Phone_result.innerText = result.message;
}
}
//相关文档
手机号可用情况下返回如下：
{
‘’staatus’’:0,
‘’message’’:{
‘’tips’’:’’手机号可用‘’，
phonefrom’’:’’中国电信’‘
}
}
手机号不可用情况下返回如下：
{
‘’staatus’’:0,
‘’message’’:’‘手机号已被注册’‘
}
//
}
}
};
};
对于手机号码唯一性验证中带了很多信息，在这样一些字符串中获取一些值，相对来说不是特别方便，只有将其转换为对象，才可以方便的获取到 message 、tip、phonefrom 等信息。
所以在用 JSON.parse(result) ;时，是将一个字符串转化为一个对象。但字符串转换为对象，是有格式要求的。
result 字符串必须是 Json 格式规范的字符串。只有 Json 格式的字符串才能通过JSON.parse() 将一个字符串转变为对象。
转变成对象之后就可以通过...的方式获取到这个对象的一些值。
将字符串转化为对象只是为了方便获取一些值。
二、功能测试
编程完成后进行简单测试，刷新界面，切换一下光标。测试手机号可用与不可用相关情况。
对于最后一个案例需要注意的是，获取数据时是一个字符串。如果这一字符串是一种 JSON 格式的字符串，就可能将其转变为对象。
对象为对象之后可通过...的方式，容易的获取到一些值。
