ajax实现的1+3种方法

AJAX  非同步( 异步 ) 的 javascript and xml ；

页面局部刷新的一个技术

一、js实现

     实现步骤：

1. 创建XHR对象；var a=new XMLHttpRequest();

2. 打开连接；a.open("get",url,true);

3. 设置回调函数a.onreadystatechange=函数名;

4. 发送请求a.send();

例：

<script>

   var xhr=new XMLHttpRequest();

   window.οnlοad=function(){

    $("code").οnkeyup=function(){

           xhr.open("get","Zip.do?code="+$("code").value,true);

           xhr.onreadystatechange=show;

           xhr.send(null);

    }

}

   function show(){

         if(xhr.readyState==4){

              var v=xhr.responseText;

             alert(v);

     }

   }

  function $(id){

   return document.getElementById(id);

   }

</script>

 

二、jquery实现

1.$.ajax({})

  例：

          $.ajax({

             url:"validTimeAndUserId",

            data: {"userId":$(this).val(),"invigiId":$("#is").val()},

            type:"POST",

            dataType:"json",

            beforeSend:function(jqXHR){

    },

           success:function(json){

           alert(json);

    },

          error:function(xhr,status,errorThrown){

          alert("status:"+status+",error:"+errorThrown+",state:"+xhr.readyState);

    }

})

2.$.get

  通过远程 HTTP GET/POST请求载入信息。

  用一个简单的 GET请求功能以取代复杂 $.ajax。请求成功时可调用回调函数。

  如果需要在出错时执行函数，请使用 $.ajax。

例：

  

    $.get("test.cgi", { name:"John", time: "2pm" },function(data){

                alert("Data Loaded: " + data);

         });

 

 

3.$.getJson

   通过 HTTP GET 请求载入 JSON 数据。

语法：

 $.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )

    url      必选，表示json数据的地址；
   data     可选，用于请求数据时发送数据参数；
   success  可 选 ，这是一个回调函数，用于处理请求到的数据。

例：

  $.getJSON('test.json', function(data){

     for (var i = 0; i < data.rows.length; i++) {

       $('#test').append('<p>' + data.rows[i].realName + '</p>');

    }

  });