Ajax根本流程
日期：2014-05-16 浏览次数：20793 次
Ajax基本流程
Ajax基本流程
1.???? Web表单中获取数据
2.???? 建立XmlHttpRequest
3.???? 根据XmlHttpRequest中的oper方法来确定发送的请求方式和URL以及是否同步执行。（没有发送请求，要用到send方法才能发送。）
4.???? 设置响应接受后运行函数。
5.???? 用XmlHttpRequest中的send方法来发送请求。Loaded方法来确定是完全接收响应。
编写Ajax简单实例
Text.jsp页面?
?
<body>
?? <form name="form1"?action=""?method="post">
?User Name:<input type="text"?name="username"?value="">
?<input type="button"?name="check"?value="check"?onClick="userCheck()">
</form>
? </body>
?
<script type="text/javascript">
??var?http_request =?false;
??function?send_request(url) {//初始化、指定处理函数、发送请求的函数
?? ????????????????????? ??//开始初始化XMLHttpRequest对象
???if(window.XMLHttpRequest) { //Mozilla 浏览器
?? ?http_request =?new?XMLHttpRequest();
??? }
?? /*
????? XMLHttpRequest 得到了所有现代浏览器较好的支持。
?????????????? 唯一的浏览器依赖性涉及 XMLHttpRequest 对象的创建。
?????????????? 在 IE 5 和 IE 6 中，必须使用特定于 IE 的 ActiveXObject() 构造函数。
?? */
???else if?(window.ActiveXObject) { // IE浏览器
??? ????try?{
??? ???? ?? http_request =?new?ActiveXObject("Msxml2.XMLHTTP");????
??? ??? }?catch?(e) {
??? ?????try?{
??? ???? ?? http_request =?new?ActiveXObject("Microsoft.XMLHTTP");
??? ???? }?catch?(e) {}
??? ??? }
?? }
???if?(!http_request) { //异常，创建对象实例失败
??? window.alert("不能创建XMLHttpRequest对象实例.");
????return false;
?? }
?? http_request.onreadystatechange = processRequest;?? //当属性调用open和send方法的时候，这个onreadystatechange方法就会调用
?? // 确定发送请求的方式和URL以及是否同步执行下段代码
?? http_request.open("GET", url,?true);//open方法已调用，但是 send() 方法未调用。请求还没有被发送。
?? http_request.send(null);//方法已调用，HTTP 请求已发送到 Web 服务器。未接收到响应。 如果是post的方式提示用Send（“username=abc”）这样传值。而get方式只能在uri中加参数
? }
? // 处理返回信息的函数
?????function?processRequest() {
?????????if?(http_request.readyState == 4) { // 判断对象状态?? ? readyState == 4 是判断HTTP响应已经是否完全接收
?????????????if?(http_request.status == 200) { // 信息已经成功返回，开始处理信息
???????????????? alert(http_request.responseText);//当readyState==4时responseText保存了完整的响应体
???????????? }?else?{ //页面不正常
???????????????? alert("您所请求的页面有异常。");
???????????? }
???????? }
???? }
??function?userChec
