大家好，帮我写一个 AJAX 的小例子可以吗？详情进来看。

我也想用ajax做个进度条,怎么做呀?

解决方案 »

  1.   

    <!--Request.htm----------------------------------------------------------->
    <html>
    <head>
    <title>Ajax应用实例</title>
    <script type="text/javaScript">
    var xmlHttp;
    var requestType="";
    function createXMLHttpRequest(){
    if(window.ActiveXObject){
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if(window.XMLHttpRequest){
    xmlHttp = new XMLHttpRequest();
    }
    }
    function startRequest(theRequestType){
    requestType = theRequestType;
    createXMLHttpRequest();
    xmlHttp.onreadystatechange = handleStateChange;
    xmlHttp.open("GET","Response.xml",true);
    xmlHttp.send(null);
    }
    function myCallback(){
    if(xmlHttp.readyState==4){
    if(xmlHttp.status==200){
    if(requestType=="all")
    listAll();
    else if(requestType=="north")
    listNorth();
    }
    }
    }
    function listAll(){
    var xmlDoc = xmlHttp.responseXML;
    var allProvs = xmlDoc.getElementsByTagName("prov");
    outputList("all",allProvs);
    }
    function listNorth(){
    var xmlDoc = xmlHttp.responseXML;
    var north = xmlDoc.getElementsByTagName("north")[0];
    var northProvs = north.getElementsByTagname("prov");
    outputList("north",northProvs);
    }
    function outputList(title,provs){
    var out=title;
    var currentProv = null;
    for(var i=0;i<provs.length;i++){
    currentProv = provs[i];
    out = out + “<br/>” + currentProv.childNodes[0].nodeValue;
    }
    document.getElementById(title).innerHTML = out;
    }
    </script>
    </head>
    <body>
    <h1> Ajax应用实例</h1>
    <form action="#">
    <input type="button" value="列出所有沿海省市"
    conclick="startRequest('all'); "/>
    <div id="all"></div>
    <input type="button" value="列出江北沿海省市" 
    conclick="startRequest('north'); "/>
    <div id="north"></div>
    </form>
    </body>
    </html>
    <!--Response.xml---------------------------------------------------------->
    <?xml version="1.0"encoding="utf-8" ?>
    <provs>
    <north>
    <prov>辽宁</prov><prov>河北</prov><prov>天津</prov>
    <prov>山东</prov><prov>江苏</prov>
    </north>
    <south>
    <prov>浙江</prov><prov>福建</prov><prov>广东</prov>
    <prov>广西</prov><prov>海南</prov><prov>上海</prov>
    <prov>台湾</prov><prov>香港</prov><prov>澳门</prov>
    </south>
    </provs>
      

  2.   

    利用XMLHTTP无刷新获取数据. 客户端和服务器端数据的交互有几种方法.
    1.提交,通过<form></form>提交到服务器端.也称"有刷新"吧.
    2.通过XMLHTTP无刷新提交到服务器端,并返回数据.也称"无刷新"吧.
    利用XMLHTTP我们可以实现很多很强大的应用.这文章主要介绍它的一
    些简单的应用.附:因为XMLHTTP是IE5.0+支持的对象.所以你必须要有IE5.0+才能看到效果.client.htm<script language="JavaScript">
    function GetResult(str)
    {
    /*
     *--------------- GetResult(str) -----------------
     * GetResult(str) 
     * 功能:通过XMLHTTP发送请求,返回结果.
     * 参数:str,字符串,发送条件.
     * 实例:GetResult(document.all.userid.value);
     * author:wanghr100(灰豆宝宝.net)
     * update:2004-5-27 19:02
     *--------------- GetResult(str) -----------------
     */
        var oBao = new ActiveXObject("Microsoft.XMLHTTP");
        //特殊字符：+,%,&,=,?等的传输解决办法.字符串先用escape编码的.
        //Update:2004-6-1 12:22
        oBao.open("POST","server.asp?userid="+escape(str),false);
        oBao.send();
        //服务器端处理返回的是经过escape编码的字符串.
        document.all.username.value=unescape(oBao.responseText)
    }
    </script>
    <input type="button" onclick="GetResult(document.all.userid.value)" value="Get"><br>
    userid:<input type="text" name="userid"><br>
    username:<input type="text" name="username">
    server.asp  服务器端处理.<% @Language="JavaScript" %>
    <%
    function OpenDB(sdbname)
    {
    /*
     *--------------- OpenDB(sdbname) -----------------
     * OpenDB(sdbname) 
     * 功能:打开数据库sdbname,返回conn对象.
     * 参数:sdbname,字符串,数据库名称.
     * 实例:var conn = OpenDB("database.mdb");
     * author:wanghr100(灰豆宝宝.net)
     * update:2004-5-12 8:18
     *--------------- OpenDB(sdbname) -----------------
     */
        var connstr = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source="+Server.MapPath(sdbname);
        var conn = Server.CreateObject("ADODB.Connection");
        conn.Open(connstr);
        return conn;
    }
    var sResult = "";
    var oConn = OpenDB("data.mdb");
    //特殊字符：+,%,&,=,?等的传输解决办法.客户端字符是经过escape编码的
    //所以服务器端先要经过unescape解码.
    //Update:2004-6-1 12:22
    var userid = unescape(Request("userid"));
    var sql = "select username from users where userid='"+userid+"'";
    var rs = oConn.Execute(sql);
    if(!rs.EOF)
    {
        sResult = rs("username").Value;
    }
    else
    {
        //加入容错.2004-5-30 10:15
        sResult = "Sorry,没有找到..."
    }
    //escape解决了XMLHTTP。中文处理的问题.
    Response.Write(escape(sResult));
    %>数据库设计 data.mdb
    表users.
    字段
    id  自动编号
    userid  文本
    username 文本表:users 数据: 
    id userid  username
    1 wanghr100 灰豆宝宝.net
      

  3.   

    ajax很容易,建议看ajax新手快车道