1:Ajax
异步的JS
组成: XHR,JS,XML,CSS
2:如何创建XHR对象
IE/其他的浏览器
2:异步同步
异步的情况:
function_get() {
//1:声明访问的地址
vardd = newDate();
varurl = "/20160515/random?"+dd.getTime();
//2:设置如何访问这个url
xhr.open("GET",url,true);//默认值就是异步
//
xhr.onreadystatechange = function() {
if(xhr.readyState == 4) {//判断是否接收到了数据
alert("2:接收数据完成了")
//判断服务器的状态
if(xhr.status == 200) {
//如果数据成功,就返回
vartxt = xhr.responseText;
document.getElementsByName("random")[0].value = txt;
} else{
"失败:"+ xhr.status);
}
};
//4:开始请求数据
xhr.send();
"1:请求发送完成了.如果这儿先执行,即没有以阻塞的方式运行。");
同步的情况:
function"1:接收数据完成了"xhr.send();
"2:请求发送完成了.如果这儿先执行,即没有以阻塞的方式运行。"}
3:xhr对象的方法
open
创建一个新的http请求,并指定此请求的方法、URL以及验证信息
语法
oXMLHttpRequest.open(bstrMethod,bstrUrl,varAsync);
bstrMethod: get | post
发送请求到http服务器并接收回应 向服务器发送请求。 Get : xhr.send(); Post : xhr.send(“name=Jack&age=34“); |
单独指定请求的某个http头 |
如果你的请示是 post方式
则必须要设置请求头为:
xhr.setRequestHeader(“Content-Type”application/x-www-form-urlencoded属性:
responseText
将响应信息作为字符串返回
语法
strValue = oXMLHttpRequest.responseText;
用于获取服务器返回的 out.print(‘......’
4:用get方式向服务器发送请求+参数
思想:参数都在url的后面即:
Http://ip:port/project/resource?name=Jack&age=89
varnm = document.getElementsByName("name")[0].value;
nm = encodeURI(nm);
varparm = "name="+nm+"&age=90";
+dd.getTime()+"&"+param;
alert(url);
5:向服务器发送post请求
1:open(“POST”,...);
2:设置请求头:xhr.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”);
3:请求的数据 在send(“name=uuu&age=999”);
function_post() {
varnm = document.getElementsByName("name")[0].value;
varparam = "name="+ nm + "&age=87";
param = encodeURI(param);
xhr.open("POST","random");
xhr.setRequestHeader("Content-Type""application/x-www-form-urlencoded"xhr.onreadystatechange = function() {
if(xhr.readyState == 4) {
if(xhr.status == 200) {
vartxt = xhr.responseText;
alert("txt is:"+ txt);
}
};
xhr.send(param);
}
6: 将验证码的验证用ajax来实现,用户名是否重复
可以创建一个公共的JS文件,里面直接创建xhr对象。
导入:
7:安装插件:
Aptana
Jboss: