Ajax

1.AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)

2.创建Ajax

  前言:IE5,6没有XMLHTTPRequest对象,用的是ActiveXObject("Microsoft.XMLHTTP");

  var xmlhttp;

  if(Window.XmlHttpRequest){

     // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码

    xmlhttp=new XmlHttpRequest();

  }else{

    //IE5,6

    xmlhttp=new ActivexObject("Microsoft.XMLHTTP");

  }

3.XmlHttpRequest的使用

  1)发送数据

    get方式:xmlhttp.open("GET","/try/ajax/demo_get.php?t=" + Math.random(),true)

         xmlhttp.send();//这里就没有参数了参数在url中了

    post方式:xmlhttp.open("POST",url地址,true)//这里的url没有传递的参数了

         xmlhttp.send("fname=Henry&lname=Ford")//这里可以放参数而且类型不限

         //send还可以设置请求头

         xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

    第三个参数async=false时,不推荐这样后就不用写onreadystatechange();

  2)接受数据

    XmlHttpRequest有两个属性作为其从服务器放回的结果

    responseText属性:返回结果是字符串

    responseXML属性:返回结果是XML数据

    AJAX的事件onreadystatechange():服务器返回结果,状态改变时触发,一般用来接受服务器返回数据的监听器

        返回状态有:readyState:(0:请求未初始号;1:服务器连接已建立;2:请求已接收;3请求处理中;4:请求已完成,且响应已就绪)

              state:200;404

例子:

 var xmlhttp;    
  if (str=="")
  {
    document.getElementById("txtHint").innerHTML="";
    return;
  }
  if (window.XMLHttpRequest)
  {
    // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    xmlhttp=new XMLHttpRequest();
  }
  else
  {
    // IE6, IE5 浏览器执行代码
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","/try/ajax/getcustomer.php?q="+str,true);
  xmlhttp.send();

 

 

 

posted @ 2017-05-10 09:18  王吉平  阅读(334)  评论(0编辑  收藏  举报