简单的ajax发布不起作用

Question

我是AJAX新手。 我正在编写代码来理解它，但是无论如何我都无法使其正常工作。 当用户按下“保存”按钮时，代码中的textarea应该更新id=218的注释的comment_area 。 我的AJAX代码中可能有一个我找不到的错误。

我的AJAX脚本：

<script type="text/javascript">
$(document).ready(function() {
    $("#save").submit(function() {
        var text = $('#breaking_news_text').val();
        var id = 218,
        $.ajax({
            type: "POST",
            url: "update.php",
            data: {comment_area:text , id:id}
            success: function() {
                alert("sucess");
            }
        });
    });
});
</script>

<div id="b_news">

        <form method="post" action="">
        <div>
            <div>
              <textarea id="breaking_news_text" class="breaking_news_text" rows="6" cols="50"  placeholder="Add text here..." required></textarea>
            </div>
        </div>
        <div>

            <input  type="button" id="save" value="Save Changes"/>

        </div>
        </form>

</div>

我的update.php文件

<?php 
include("./inc/connect.inc.php");

    if(isset($_POST['comment_area']))
    {
            $update = mysqli_real_escape_string($mysqli, $_POST['comment_area']);
            $sql = "update comments set comment_area='$update' Where id='".$_POST['id']."'";
            $result = mysqli_query($mysqli, $sql);

    }   
?>

Answer 1

submit工作在form ，您可以将其放在input元素上。

尝试：

$("#b_news form").submit(function(evt) {
    evt.preventDefault(); //this is required to stop the default form submission

文档可以在这里找到

另外，如果这些dom元素是动态加载的，则可能需要阅读event delegation