Ajax试图执行PHP页面将我带到新页面

Question

我正在尝试使用PHP和mysql及AJAX进行实时聊天。它几乎可以正常运行，除了我似乎无法弄清楚如何在不重新加载页面的情况下提交聊天消息。我有一个页面sendchat.php，该页面接受上一页的输入并将数据输入数据库。我正在尝试使用文本输入字段，当用户单击Enter键时，它将执行PHP页面，其中包含发送到sendchat.php所需的详细信息，而无需实际加载或刷新页面。这是我到目前为止所拥有的：

 <form id="send-message-area">
            <p>Your message: </p>
            <input type="text" id="sendie" maxlength = '100' onkeydown="onChatEnter(this);"></textarea>
        </form>

    </div>
    </td></tr></table>


 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">



 function onChatEnter(str) {
      if(event.key === 'Enter') {

   $.ajax({
                type: "GET",
                url: "sendchat.php?msg=" + str ,
                                success : function() { 

                    // here is the code that will run on client side after running clear.php on server



                }
            });

}

 </script>

它所做的只是尝试加载url，但没有尝试找到sendchat.php或发送数据。相反，它只是尝试加载空白页。我在哪里错了？一切似乎拼写正确且区分大小写。我检查用户在按下某个键时是否按下回车键。如果他们这样做了，我将加载一个AJAX函数来执行一个PHP页面。但是，它没有这样做。仅出于仅供参考，我不希望单击那里的按钮。

编辑：

我尝试了以下建议，但仍然没有。我决定现在尝试另一种方法。仍然不起作用。

<script>
function updatechat(str) {
    if(event.key === 'Enter') {

    if (str=="") {
    document.getElementById("sendie").innerHTML="";
    return;
  } 
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else { // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (this.readyState==4 && this.status==200) {
      document.getElementById("sendie").innerHTML=this.responseText;
    }
  }
  xmlhttp.open("GET","sendchat.php?msg="+str,true);
  xmlhttp.send();

    }
}
</script>

 <p>Your message: </p>
            <input type="text" id="sendie" maxlength = '100' onkeypress="updatechat(this.value);"></input>

Answer 1

尝试一下：

$("#send-message-area").submit(function(e) {
    e.preventDefault();
    e.stopPropagation(); 
});