javascript - 简单的ajax帖子不起作用

Question

我是一个 AJAX 菜鸟。我正在编写代码来理解它，但无论如何我都无法让它工作。当用户按下“保存”按钮时，代码中的文本区域应更新 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

文档可以是found here

此外，如果这些 dom 元素是动态加载的，您可能需要 read up on event delegation