AJAX: 如何使用HttpRequest對象

使用HttpRequest對象發送請求步驟：

1. 創建 HttpRequest 對象 

var xmlhttp = new XMLHttpRequest();

2. 告訴 XMLHttpRequest 對象，當狀態發生改變時， 會調用哪個函數。

爲此，要把 onreadystatechange 屬性設置爲指向 JavaScript 函數的指針

xmlhttp.onreadystatechange = renewMsg;

3. 指定請求屬性。XMLHttpRequest  對象的 open() 方法指定將發出的請求。

xmlhttp.open("GET", url, true);

4. 將請求發送給服務器。send() 方法把請求發送到指定的目標資源。

例子：

//發送給ajax接收器
function sendMsgToAjax()
{
    //
    var question = document.getElementById('inputArea').value;
    //alert(msg);
    question = trim(question);
    if(question == "請提問" || question == "請在此輸入您的問題" || question == "您的建議答案是") return;
    if(question != "")
    {
        var url = "recvMsg.php?question=" + question + "&TempUserID="+TempUserID + "&preQuestion="+preQuestion+ "&IsTeachMode="+ IsTeachMode + "&IsAsk="+ IsAsk;

        preQuestion = question;
        document.getElementById('inputArea').value = "";
        //alert(url);
        xhr.open("GET", url, true);
        xhr.setRequestHeader("If-Modified-Since","0");
        xhr.onreadystatechange = renewMsg; //只要響應來，就調用這個函數
        xhr.send();
    }
}

//更新本頁內容
function renewMsg()
{
    if(xhr.readyState == 4)
    { //XMLHttpRequest
        var xmlDoc = xhr.responseText;
        //alert(xmlDoc);
        var s = xmlDoc.split("|");
        xmlDoc = s[0];
        //alert(s[0]);
        //alert(s[1]);
        //接收信息內容去掉html標籤
        xmlDoc = xmlDoc.replace(/>/g, '>');
        xmlDoc = xmlDoc.replace(/</g, '<');
        xmlDoc = xmlDoc.replace(/"g/, '\"');

        var financeUrl = s[1];/////////金融圖片
        document.getElementById('financeImg').src = financeUrl;

        var weatherURL = s[2];
        document.getElementById('weather').src = weatherURL;

        var searchURL = s[3];
        document.getElementById('contentFrm').src = searchURL;

        if(financeUrl)//判斷是否是金融問句，是跳轉到股票section
        {
            doClick('a_section2');
        //document.getElementById("a_section2").click(); //變態的ie8不支持
        }
        else if(weatherURL)
        {
            doClick('a_section3');
        }
        else if(searchURL)
        {
            doClick('a_section4');
        }
        else  //不是以上問句，跳轉到首頁section
        {
            doClick('a_section0');
            //document.getElementById("a_section0").click();//變態的ie8不支持
        }

        //alert(financeUrl);
        //location.reload();
        //alert(xmlDoc);
        var oldMsg = document.getElementById('outputArea').innerHTML;
        //alert(old);
        document.getElementById('outputArea').innerHTML = oldMsg + xmlDoc ;
    }
    if(xhr.readyState == 4 && IsTeachMode)
    {
        IsAsk++;
        if(IsAsk % 2 == 0)
        {
            document.getElementById('inputArea').value = '請提問';
        }
        else
        {
            document.getElementById('inputArea').value = '您的建議答案是';
        }
    }
    //滾動條置底
    var div = document.getElementById('outputArea');
    div.scrollTop = div.scrollHeight;
}