Ajax

1.Ajax是什么

 ajax是异步的js和xml

 是7种技术的综合（js, xml, xstl, dom, xhtml xmlhttprequest,css）

 ajax是一个与服务器端语言无关的技术（php/java ee/.net）

 ajax可以给客户端返回三种格式的数据（文本格式， xml, json）

 无刷新数据交换技术有以下：flash, java applet, 框架， iframe, ajax

onreadystatechange事件：

readystate:

 0: 请求未初始化

 1：启动。已经调用open方法，但没有调用send方法（服务器连接已建立）

 2：发送。已经调用send方法，但尚未接到响应（请求已接收）

 3：接收。已经接收到部分响应数据（请求处理中）

 4：完成。已经接收到全部响应数据，而且已经可以再客户端使用了（请求已完成，且响应就绪）

第一种方式：通过get方式发出请求

<script type="text/javascript">
    var xmlHttprequest;
        function getXmlHttpRequst() {
            // 不同浏览器获取对象xmlhttprequest方法不一样            
            if(window.ActiveXObject){
                xmlHttprequest = new ActiveXObject();
            }
            else{
                xmlHttprequest = new XMLHttpRequest();
            }
            return xmlHttprequest;
        }
        
        function checkUser() {
            var xmlHttprequest = getXmlHttpRequst();   // 一号线：创建对象
            // 判断xmlHttprequest对象是否创建成功
            if(xmlHttprequest) {
                // 通过xmlHttprequest对象发送请求到服务器
                var url = "/test1/a.php?username="+$("username").value;
                xmlHttprequest.open("get", url ,true);
                xmlHttprequest.onreadystatechange = chuli;  // 调用处理函数输出取得的值
                 // 二号线：发送数据 
                xmlHttprequest.send(null);                                     
            }
            else{
                alert("创建失败");
            }        
        }
        function $(id) {
            return document.getElementById(id);
        }
        function chuli(){
            if(xmlHttprequest.readyState == 4){
                // console.log(xmlHttprequest.responseText);
                $("myres").value = xmlHttprequest.responseText;
            }
        }
    </script>

<!-- a.php -->
<?php
// 接收数据
$username = $_GET['username'];
// echo $username;  // 3号线：接收并返回数据
if($username == "huqingiqng") {
    echo "用户名正确";  // 注意，这里数据时返回给请求的页面，所以是在请求的地方输出
}
else{
    echo "用户名错误";
}
?>

第二种：通过post方式发送请求

function checkUser() {
            var xmlHttprequest = getXmlHttpRequst();   // 一号线：创建对象
            // 判断xmlHttprequest对象是否创建成功
            if(xmlHttprequest) {
                // 通过xmlHttprequest对象发送请求到服务器
                var url = "/test1/a.php";
                var data = "username="+$("username").value;
                xmlHttprequest.open("post", url ,true);
                xmlHttprequest.setRequestHeader("Content-type","application/x-www-form-urlencoded") // 这句话必须加上
                //指定回调函数
                xmlHttprequest.onreadystatechange = chuli;  // 调用处理函数输出取得的值
                 // 二号线：发送数据 
                xmlHttprequest.send(data);                                     
            }
            else{
                alert("创建失败");
            }        
        }

<?php
// 接收数据
$username = $_POST['username'];
// echo $username;  // 3号线：接收并返回数据
if($username == "huqingiqng") {
    echo "用户名正确";  // 注意，这里数据时返回给请求的页面，所以是在请求的地方输出
}
else{
    echo "用户名错误";
}
?>