使用ajax提交表單並返回結果

Question

我創建了一個消息傳遞系統，該系統允許用戶向彼此發送消息。 效果很好，但是當他們答復時，我不希望他們被帶到另一個頁面，我希望警報說“已發送”或“未發送”。 下面是我的代碼不起作用。

在php中：

 echo"<form id=\"form\" name=\"form\" method=\"post\" onsubmit=\"send(reply)\">";

JavaScript的：

 function send(reply)
 {
    var httpRequest;
    make_request()
    function stateck() 
        {
        if(httpxml.readyState==4)

        { 

        alert (httpxml.responseText);   

        }

    httpxml.onreadystatechange=stateck;
    reply_url="compose.php?reply=" + reply.value + "&msgid="<?php echo $msgid; ?> + "&to="<?php echo $to; ?> + "&subject="<?php echo $subject; ?>";
    httpxml.open("GET",reply_url,true);
    httpxml.send(null);
    }
}

我正在使用php php變量，因為需要從數據庫訪問此數據。

謝謝

Answer 1

由於進行了表單提交，因此將您帶到了另一個頁面。 如果您不希望提交表單，請使用

onsubmit="send(reply); return false;"

順便說一句，您可以使用單引號：echo'...'，因此您無需轉義字符串中的所有雙引號。

Answer 2

您需要通過在提交處理程序中返回false來告訴瀏覽器您自己處理了該事件：

echo"<form id=\"form\" name=\"form\" method=\"post\" onsubmit=\"send(reply); return false;\">";

同樣，您的send函數看起來會生成一個錯誤，這將導致瀏覽器提交。 您沒有在任何地方分配給httpxml。 我認為您確實想要：

 function send(reply) {
     var httpxml;
     httpxml = make_request();
     stateck = function () {
        if(httpxml.readyState==4){ 
            alert (httpxml.status);// you will want to check the server response code too
            alert (httpxml.responseText);       
        }

     };

     httpxml.onreadystatechange=stateck;
     reply_url="compose.php?reply=" + reply.value + "&msgid="<?php echo $msgid; ?> + "&to="<?php echo $to; ?> + "&subject="<?php echo $subject; ?>";
     httpxml.open("GET",reply_url,true);
     httpxml.send(null);
 }

Answer 3

您可以考慮使用JavaScript庫。 為什么要重新發明輪子呢？

例子：

• jQuery的
• MooTools的
• 原型

Answer 4

通常，如果您想通過Ajax返回某些內容，則希望避免提交頁面。 但是，如果您希望用戶感覺自己正在提交表單，請在將用作Ajax提交按鈕的頁面上放置一個普通按鈕（即不是提交按鈕）。 將您的Ajax更新功能綁定到onclick上，並使您將請求定向到的PHP頁面發送響應中所需的任何結果。 其他所有內容（將結果文本放入字段等）都應該是標准的Ajax和JavaScript。

Answer 5

我同意Natrium。 javascript庫是必經之路。 我更喜歡使用prototype / scriptaculous，以便使用原型快速介紹Ajax，請參閱以下內容

http://www.prototypejs.org/learn/introduction-to-ajax