ajax详解

ajax详解，原声的ajax 是通过XMLHttpRequest对象，进行异步通讯的。

    var request;
    if(window.XMLHttpRequest){
        request  = new XMLHttpRequest();//IE7+。。。。。。
    }else{
        request = new ActiveXObject("Microsoft.XMLHTTP");//IE5，IE6
    }
    //request.open(method,url,async)
    request.open("GET",'get.php',true);
    request.send(string);
    //发送请求
    request.open("POST","create.php",true);
    request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    request.send("name=王二狗&sex=男");

    //获取请求
    request.responseText //获取字符串形式的响应数据
    request.status   request.statusText;
    request.getAllResponseHeader()
    //获取得到通知
    //request .readyState属性  状态  4代表响应就绪
    request.onreadystatechange = function(){
        if(request.readyState==4&&request.status==200){
           // do some thing 请求完成 ，并且成功了， 
        }
    }

两个例子，代表收，发

document.getElementById("search").onclick = function() { 
    var request = new XMLHttpRequest();
    request.open("GET", "server.php?number=" + document.getElementById("keyword").value);
    request.send();
    request.onreadystatechange = function() {
        if (request.readyState===4) {
            if (request.status===200) { 
                document.getElementById("searchResult").innerHTML = request.responseText;
            } else {
                alert("发生错误：" + request.status);
            }
        } 
    }
}

document.getElementById("save").onclick = function() { 
    var request = new XMLHttpRequest();
    request.open("POST", "server.php");
    var data = "name=" + document.getElementById("staffName").value 
                      + "&number=" + document.getElementById("staffNumber").value 
                      + "&sex=" + document.getElementById("staffSex").value 
                      + "&job=" + document.getElementById("staffJob").value;
    request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    request.send(data);
    request.onreadystatechange = function() {
        if (request.readyState===4) {
            //4代表通讯状态，结束        
            if (request.status===200) {   //200代表服务器结果，success
                document.getElementById("createResult").innerHTML = request.responseText;
            } else {
                alert("发生错误：" + request.status);
            }
        } 
    }
}

运用jquery ajax的例子

$.ajax({ 
            type: "GET",    
            url: "https://127.0.0.1:8080/ajaxdemo/serverjson2.php?number=" + $("#keyword").val(),
            dataType: "json",
            success: function(data) {
                if (data.success) { 
                    $("#searchResult").html(data.msg);
                } else {
                    $("#searchResult").html("出现错误：" + data.msg);
                }  
            },
            error: function(jqXHR){     
               alert("发生错误：" + jqXHR.status);  
            },     
        });