|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body>
<h1>你好！！！</h1>
<button style="width: 200px;height: 100px;" id="sendAjaxPost">发送Post请求</button>
<script type="text/javascript">
var xhr;
var btn = document.getElementById("sendAjaxPost");
btn.onclick = function(){
/* $.post('data', { name:'zhangsan1' }, function(response){
alert(response);
}) */
/* $.get("data?name=zhangsan001",function(data){
alert(data);
}); */
/* for(var i in XMLHttpRequest){
console.log(i + "---" + XMLHttpRequest[i]);
} */
//创建XMLHttpRequest对象
xhr = new XMLHttpRequest();
//注册回调函数
xhr.onreadystatechange=callback;
//第一个参数设置成post，第二个写url地址，第三个为是否采用异步方式
xhr.open("POST","data",true);
//post请求需要自己设置请求头
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//post请求
xhr.send("name=lisi");
}
function callback(){
//接收响应数据
//判断对象状态是否交互完成，如果为4则交互完成
if(xhr.readyState == 4){
//判断对象状态是否交互成功，如果成功则为200
if(xhr.status == 200){
//接收数据，得到服务器输出的纯属文本数据
var response = xhr.responseText;
alert("返回的数据为：" + response);
}
}
}
</script>
</body>
</html>
|
