Ajax经典demo

一些基础知识：
首先了解XMLHttpRequest对象的属性和方法：

对象属性

方法

关于Ajax的示例：
一：
创建一个XMLHttpRequest对象

//创建ajax引擎对象
    function createAjaxObject(){
        if(window.ActiveXObject){
            var newRequest = new ActiveXObject("Microsoft.XMLHTTP");
        }else{
            var newRequest = new XMLHttpRequest();
        }
        return newRequest;
    }

创建对象:

var http_request = createAjaxObject();//①创建一个XMLHttpRequest对象

二：创建url,data,通过 xmlHttpRequest.send()

if(http_request){
var url = "sendmes.php";//通过myXmlHttpRequest对象发送请求到服务器的某个页面
            var sender = "";
            var geter = "";
            var content = $("#sendBox").val();//页面抓取的值
            var data = "content="+content+"&sender="+sender+"&geter="+geter;

三：打开请求

http_request.open("post",url,true);
            //第一个参数表示请求的方式, "get" / "post"//第二个参数指定url,对哪个页面发出ajax请求(本质仍然是http请求)
            //第三个参数表示 true表示使用异步机制,如果false表示不使用异步

1使用GET的话使用get方式发出请求，如果提交的用户名不变化，浏览器将不会真的发请求，而是缓存取数据

url="/ajax/registerProcess.php?mytime="+new  Date()+"&username="+$("username").value;

或：告诉浏览器不要缓存数据//header("Cache-Control: no-cache")
若浏览器返回的数据是xml格式
//header("Content-Type: text/xml;charset=utf-8");

***还有一句话，这句话必须.用JSON提交//POST方式交互所需要增加的代码
http_request.setRequestHeader("content-type","application/x-www-form-urlencoded");
四：指定回调函数：注册回调方法

//指定回调函数.
            http_request.onreadystatechange = function(){
                if(http_request.readyState==4){
                    //等于200表示成功
                    if(http_request.status==200){
                        var res = http_request.responseText;
                        if(res!=""){
                            //res==""说明发送成功，然后就将发送信息写入messageBox
                            //var nowtime = new Date().toLocaleString();
                            var content1 = ""+res+"\r\n";
                            var content2 = content+"\r\n" ;
                            var contents = $("#messageBox").val()+content1+content2;
                            //alert(content);
                            $("#messageBox").val(contents);
                            $("#sendBox").val("");  //将发送框清除
                        }
                    }
                }
            }
设置向服务器端发送的数据，启动和服务器端的交互
//真的发送请求,如果是get请求则填入 null即可
            //如果是post请求，则填入实际的数据
            http_request.send(data);

五：服务器端接收 ajax的请求,做相应处理(操作数据库)，然后返回结果(echo 语句)
六：客户端通过xmlHttpRequest的属性 reponseText , responseXML 取的数据，然后就完成局部刷新当前页面任务

示例：

登陆 注册";
        exit();
    }else{
        echo $nickname. " 在线 退出登陆";
    }
?>

    

    
与  聊天中
    

    


    
    

sendmes.php:

getmes.php

0){
        $sql = "update message set mloop=1 where sender='{$geter}' and geter='{$sender}' and mloop=0";
        mysql_query($sql,$link);
        //file_put_contents("log.txt",$sql."\r\n",FILE_APPEND);
    }
    
?>