ajax
1.什么是ajax?(异步请求,局部刷新)
ajax是一个改善用户体验的技术,实质上是利用浏览器端ajax对象()向服务器发送异步(ajax对象在向服务器发送请求的时候,用户可以继续其他操作)请求,服务器返回的text或者xml类型的数据,浏览器根据返回的数据,对页面进行局部刷新。
在整个过程中,不会中断用户的操作,体验度好。
2.如何获取ajax对象?
非IE new XMLHttpRequest();
IE new ActiveXObject("Microsoft.XMLHttp");
3.ajax向服务器发送请求
(asynchronous JavaScript and xml)
-----发送get请求---------
1)获取ajax对象
var xhr=getXhr();
2)注册监听器
xhr.onreadystatechange
3)初始化
xhr.open('get','CheckUname.do',true);
'get':请求类型、
'checkUname.do':请求地址
'true':发送异步请求
'false';发送同步请求
ajax向服务器发送请求,在服务器返回响应之前,用户必须等待,如果服务器响应的时间过长,页面出现锁死状态,用户体验度不好
4)真正发送请求
xhr.send(null);
*ajax对象的重要属性:
1)onreadystatechange:注册一个监听器(绑定一个事件函数)
2)readyState:返回对象与服务器的状态
返回一个值,含义如下:
0:未初始化,对象已经建立,但是还没有调用open方法
1:初始化,对象已经建立,但是没有调用send方法
2:发送数据,send方法已调用
3:数据传送中,服务器已经接受了部分数据
4:响应结束,浏览器接受了所有数据
3)responseText:获取服务器返回的文本
4)responseXML:获取服务器返回的XML dom对象
5)status:获取状态码
200 405 404
若ajax发送的是get请求,IE浏览器存在以下问题
1)如果请求地址没有发生改变,那么IE不会真正向服务器发送请求,返回的是上一次请求服务器的数据(被IE缓存了)
解决方法一:给地址后面加时间戳
var url="checkUname.do?uname="+$("[name=uname]").val()+"&"+new Date().getTime();
xhr.open('get',url,true);
2)参数中文乱码问题
解决方法:
step1.Tomcat/conf/server.xml中编码格式是UTF-8
step2.encodeURI(url) 将地址中的中文以utf-8的格式转成对应的字节
解决方法二:发送post请求
----发送post请求---
1)获取ajax对象
2)同(get)
3)初始化
xhr.open('post','checkUname.do',true);
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); (这句话不能省)
4)真正发送请求
xhr.send("uname="+uname);
练习:省市联动