javascript - 调用 AJAX 通过按钮发送值

Question

我读了很多类似的问题，并且尝试了所有解决方案，但似乎没有任何效果。我想通过单击按钮发送 AJAX 请求，发送用户在 textarea 中键入的内容，并将其显示在 div(聊天框)中。当我单击按钮时，什么也没有发生。它从不调用具有 AJAX 代码的函数。你知道发生了什么吗？

附注我包含了 JavaScript 文件，但没有任何改变。

<form action="ajax()">
    <textarea id="txtArea" name="txtArea" ></textarea>
    <input type="submit" value="Submit" />
</form>

<script type="text/javascript">

 //AJAX function
function ajax() {
    alert("insert");
    var txtArea = $("#txtArea").val();

    $.ajax({
        type: "POST",
        url: "InsertMessage.php",
        data: {
            txtArea: txtArea
        }
        success: function(data) {
            alert(data);
            $("#chatbox").load("DisplayMessages.php")
            $("#txtArea").val(""); //Insert chat log into the #chatbox div				
        }
        error: function() {
            alert('there was an error, write your error handling code here.');
        }
    });
}

$(document).ready(startAjax);
//setInterval(function(){
//	$("#chatbox").load("DisplayMessages.php");		
//}//,1400);
	
</script>

Answer 1

您的问题不太清楚，但是要在提交表单时以 post 方法发送数据，然后在 div 中显示结果，请尝试如下操作:

html:

    <form>
        <textarea id="txtArea" name="txtArea" ></textarea>
        <input type="submit">
    </form>

    <div id="resultDiv">
    </div>

js:

$( "form" ).submit(function( event ) {
    var txtArea = $("#txtArea").val();
    $.ajax({
                type:"POST",
                url:"InsertMessage.php",
                data:{txtArea:txtArea}
                success: function(data){
                    alert(data);                        
                    $("#resultDiv").html(data);           
                }
                error: function(){
                     alert('there was an error, write your error handling code here.');
                }
        });
});