GET请求方法:
function checkname(){
//ajax方式校验用户名
//A. 获得被校验的用户名信息
var nm = document.getElementById('username').value;
//对 & 、= 等符号需要进行特殊处理,否则产生歧义
//encodeURIComponent()可以对特殊符号进行处理
//处理后的信息是"%后边有两个十六进制数",其实所有浏览器通用识别的信息
nm = encodeURIComponent(nm);
//B. ajax带着该名字信息去服务器端校验
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
alert(xhr.responseText);
}
}
xhr.open('get','./04.php?name='+nm+'&age=23');
xhr.send(null);
}
</script>
<h2>ajax之get请求</h2>
<p>用户名:<input type="text" id="username" onblur="checkname()" /></p>
<p>密码:<input type="text" id="userpwd" /></p>
POST请求方法:
<script type="text/javascript">
function checkname(){
//ajax方式校验用户名
//A. 获得被校验的用户名信息
var nm = document.getElementById('username').value;
//对 & 、= 等符号需要进行特殊处理,否则产生歧义
//encodeURIComponent()可以对特殊符号进行处理
//处理后的信息是"%后边有两个十六进制数",其实所有浏览器通用识别的信息
nm = encodeURIComponent(nm);
//把需要传递的信息变为"请求字符串"格式,并设置为send()方法参数
var info = "name="+nm+"&age=20";
//B. ajax带着该名字信息去服务器端校验
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
alert(xhr.responseText);
}
}
//post方式传递数据是模拟form表单方式传递数据
//form表单的数据实际是组织为xml格式传递给服务器端的
xhr.open('post','./06.php?color=red');
//设置http头协议,把传递的post
//数据组织为xml格式
//一下setRequestHeader方法必须在open方法后边调用
xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
xhr.send(info);
}
</script>
<h2>ajax之post请求</h2>
<p>用户名:<input type="text" id="username" onblur="checkname()" /></p>
<p>密码:<input type="text" id="userpwd" /></p>