get请求
实例
<!--html界面--demo1.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TestAjax</title>
<script type="text/javascript">
window.onload=function () {
document.getElementById('username').onblur = function () {
//id为username的元素失焦时触发事件onblur
var name = document.getElementById('username').value;
name=encodeURIComponent(name);
//IE不支持中文 =和&与请求的字符串的关键字相混淆
var req;
if(window.XMLHttpRequest)
req = new XMLHttpRequest();
else
req = new ActiveXObject();
req.open('get','demo1.php?name='+name,true); //get的传参方式
req.onreadystatechange = function () {
if(req.readyState == 4 && req.status == 200){
alert(req.responseText);
//获得字符串形式的响应数据，responseXML则是获取XML型的响应数据 }
};
req.send(); //建立连接
}
}
</script>
</head>
<body>
用户名：<input type="text" name="" id="username">
</body>
</html>运行实例 »
实例
<?php //php页面--demo1.php print_r($_GET); ?>
运行实例 »
post请求
HTML界面 demo2.html
实例
<!--html界面--demo2.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TestAjax</title>
<script type="text/javascript">
window.onload=function () {
document.getElementById('username').onblur = function () {
//id为username的元素失焦时触发事件onblur
var name = document.getElementById('username').value;
name=encodeURIComponent(name);
//这里post传参虽然接受中文，但是仍然会与=&关键字混淆
var req;
if(window.XMLHttpRequest)
req = new XMLHttpRequest();
else
req = new ActiveXObject();
req.open('post','demo2.php',true);
req.onreadystatechange = function () {
if(req.readyState == 4 && req.status == 200){
alert(req.responseText);
//获得字符串形式的响应数据，responseXML则是获取XML型的响应数据 }
}
};
req.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
//将传递的参数转成XML格式
req.send('name='+name); //post的传参方式
}
}
</script>
</head>
<body>
用户名：<input type="text" name="" id="username">
</body>
</html>php页面 demo2.php
实例
<?php print_r($_POST); ?>
运行实例 »
get请求可以和post请求同时使用
get请求可以被缓存，post请求不可以
get请求有参数长度限制，post请求没有限制
get请求使用更普遍
