Question

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

P.S。我包含了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

inputs属性必须包含网址，而不是Javascript。您可以使用：

action

或：

<form action="javascript:ajax()">

或者你可以在jQUery中绑定事件：

<form onsubmit="ajax(); return false;">

Answer 2

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

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.');
                }
        });
});

调用AJAX以使用按钮发送值

2 个答案: