ajax

来源:互联网 发布:华讯网络 电科软信 编辑:程序博客网 时间:2024/05/21 19:50

定义: (asynchronous 异步的 javascript and xml)

(1)ajax是什么?

是一种来改善用户体验的技术,其实质是利用浏览器提供的一个特殊的对象(XMLHttpRequest对象,也可以称为ajax对象)向服务器发送异步请求,服务器返回部分数据,浏览器利用这些数据对当前页面做局部更新,整个过程,页面无刷新,不打断用户的操作。
注:异步请求,当ajax对象在向服务器发送请求时,浏览器不会销毁当前页面,用户仍然可以对当前页面做其他操作。

  • 见图
    这里写图片描述

  • 如何获得ajax对象?

 function getXhr(){    var xhr = null;    if(window.XMLHttpRequest){        //非ie        xhr = new XMLHttpRequest();    }else{        //ie        xhr = new ActiveXObject('MicroSoft.XMLHttp');    }    return xhr;}

ajax对象的几个重要属性

1) onreadystatechange: 绑订事件处理函数。
readystatechange事件: 当readystate属性值发生了改变,
比如从1变成了2,就会产生该事件。
2) readyState: 有5个值(0,1,2,3,4),用来获得ajax对象与服务器
通信的进展。其中4表示ajax对象已经获得了服务器返回的
所有数据。
0 (未初始化):ajax对象已经创建,但是没有调用open方法
1 (载入):已经调用open()方法,未发送请求
2 (载入完成): 请求已经发送完成
3 (交互):可以接受到部分响应数据
4 (完成):已经接收了全部数据,并且连接已经关闭
responseText: 获得服务器返回的文本数据
reponseXML: 获得服务器返回的xml数据
status: 获得服务器返回的代码

缓存问题

什么是缓存问题?

IE浏览器提供的ajax对象在发送get请求时,会查看请求地址是否访问过,如果访问过,则显示第一次访问的结果。(也就是说,会将第一次访问的结果缓存下来)

缓存-解决方式:

在请求地址后面添加随机数,(使用js中内置对象的Math类)
或者改为发送post请求

ajax 中文编码问题

发送get请求
IE提供的ajax对象会对中文使用gbk来编码。
而其他浏览器会采用utf-8编码,服务器默认会使用ISO-8859-1
来解码,所有会产生乱码

编码-解决问题

step1 让服务器统一使用utf-8来编码,但是对IE(get)无效,
step2 客户端使用encodeURI函数对中文进行统一的编码。(utf-8)
注: encodeURI是javascript内置的一个函数

function check(){        var xhr = getXhr();        console.log("浏览器提供的ajax对象: " + xhr);            var t = document.getElementById('name').value;        xhr.open("get","testEncod.do?name="+ encodeURI(t),true);        xhr.onreadystatechange = function(){            if(xhr.readyState == 4 && xhr.status == 200){                console.log("数据异步加载完成");                var txt = xhr.responseText;                 $('msg').innerHTML = txt;            }        }        xhr.send(null);    }
post请求乱码原因

浏览器会对中文使用utf-8来编码,而服务端会使用ISO-8859-1来解码,所以会乱码。

post乱码解决:

req.setCharacterEncoding(“utf-8”);