zoukankan      html  css  js  c++  java
  • Ajax异步交互 [异步对象连接服务器]

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>XMLHttpRequest</title>
    <script>
    var xmlHttp;    //声明一个全局变量xmlHttp,主要是考虑到异步对象在整个页面进程中都有可能使用到。
    function createXMLHttpRequest(){  //创建一个异步对象的函数,
    if(window.ActiveXObject)    //该函数主要利用if语句进行浏览器的判断,如果是IE浏览器则采用ActiveXObject的创建方法,如果不是则直接利用XMLHttpRequest()函数,考虑兼容性,因此需要对浏览器进行判断,这基本是Ajax创建异步对象的通用方法。
    xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
    else if(window.XMLHttpRequest)
    xmlHttp=new XMLHttpRequest();
    }


    function startRequest(){
    createXMLHttpRequest();  //调用已经写好的函数,创建一个异步对象
    xmlHttp.open('GET','new_file.xml',true);  //建立一个到服务器的请求, true是异步请求,open(method,url,asynchronous,user,password),asynchronous是一个布尔值,表示是否为异步请求,默认为异步请求true。user、password分别为可选的用户名、密码。
    xmlHttp.onreadystatechange=function(){           //readystate属性判断目前请求的状态,如果该属性变化了,就会触发onreadystatechange事件。
    if(xmlHttp.readyState==4 && xmlHttp.status==200)   //如果readyState的状态为4(数据接收成功)则继续操作。并且一般情况下还要判断服务器返回的响应状态status。
    alert('服务器返回:'+xmlHttp.responseText);
    }
    xmlHttp.send(null);  //将该请求发送给服务器。send(body); 参数body,它表示要向服务器发送的数据,其格式为查询字符串的形式,例如:var body="myName=isaac&age=25";
    }
    </script>
    </head>
    <body>
    <input type="button" value="测试异步通信" onclick="startRequest()" />
    </body>
    </html>

    注意:

      如果使用POST方法进行提交请求,那么在发送前必须使用如下的语句来设置HTTP的头,语法如下:

      xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

      var queryString = "firstName=isaac&birthday=0624";

      var url="9-3.aspx?timestamp="+new Date().getTime();

      xmlHttp.open("POST",url);

      xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

      xmlHttp.send(queryString);  //该语句负责发送数据

      2,解决异步连接服务器时IE的缓存问题

      var sUrl="9-1.aspx?" + new Date().getTime();  //地址不断的变化

      xmlHttp.open("GET", sUrl, true);

    如有侵权,请联系
  • 相关阅读:
    hdu 3342 Legal or Not 拓排序
    hdu 1596 find the safest road Dijkstra
    hdu 1874 畅通工程续 Dijkstra
    poj 2676 sudoku dfs
    poj 2251 BFS
    poj Prime Path BFS
    poj 3278 BFS
    poj 2387 Dijkstra 模板
    poj 3083 DFS 和BFS
    poj 1062 昂贵的聘礼 dijkstra
  • 原文地址:https://www.cnblogs.com/liqiong-web/p/5243617.html
Copyright © 2011-2022 走看看