Javascript 我试图发表评论，工作了一秒钟，但一旦我点击提交按钮，评论就会消失

评论会出现一秒钟，然后在我发布后消失，而不会刷新页面。
你能帮帮我吗？
我想把它们（用户名和下面的注释）附加到一个div中

这是迄今为止的代码：

$("#submit").click(function() {
    var comment = $("#comment").val();
    $.ajax({
        type: 'POST',
        url: $(this).attr('action'),
        data: $(this).serialize(),
        success: function(data) {
            $("#result").append(comment);
        }
    })
});

<form action="" method="POST">
    <fieldset>
        <legend>Add a comment</legend>
        <label for="user">Username</label>
        <input type="text"  name="user" id="user" value="" maxlength="20">
        <br><br>
        <label for="comment">Comment</label>
        <textarea rows="6" cols="50" name="comment" id="comment"></textarea>
        <br><br>
        <input type="submit" id="submit" value="Submit" name="submit">
    </fieldset>
</form> 
<div id="result"></div>

$（“#提交”）。单击（函数（）{
var comment=$（“#comment”）.val（）；
$.ajax({
键入：“POST”，
url:$（this.attr（'action'），
数据：$（this）.serialize（），
成功：功能（数据）{
$（“#结果”）。附加（注释）；
}
})
});
添加评论
用户名



评论



而不是
$（“#结果”）。附加（注释）
，试试
$（“#结果”）.html（注释）
它工作1秒然后消失的原因是当用户点击提交按钮时发生了两件事

首先，您的jQuery被触发，它启动Ajax请求（您已经说过它工作正常）

其次，启动默认的HTML表单提交按钮操作，该操作在此实例中执行页面刷新

你有两种方法来解决这个问题。首先，您可以将
按钮更改为常规的
，这样就不会发生常规的HTML表单提交（但jQuery仍将运行）。或者，您可以调用
event.preventDefault（）在jQuery中单击命令，该命令将阻止默认HTML表单提交。更多信息。
嘿，它们是在刷新后消失的，还是在添加后会自动从视图中消失？在添加后，是否可以尝试将注释数据包装在标记或合适的标记中并进行附加，而不是直接附加数据？我尝试过，但找不到合适的解决方案，你能帮我看一下代码吗？当然，有可能看到上传到Plunkerit之类的东西上的代码吗？它实际上正在工作，但一旦我发布并消失，页面会自动刷新。我尝试过这样做，但仍然存在相同的问题！！我已将输入更改为按钮，并尝试使用preventDefault（），感谢help@MatteoSoresini，更改
$（“#提交”）。单击（函数（）{
到
$（“#提交”）。单击（函数（事件）{
然后添加
事件。默认（）；
作为单击函数的第一行。另外，您的
.ajax
url指向
$（this）.attr（'action'），
。在本例中，我认为
$（this）
是您的
$（“#提交”）
按钮。此按钮没有设置“action”属性，因此将失败。此外，即使您将其指向表单元素的本机action属性，也没有在此处设置，因此它将再次失败。
.ajax（）
调用在做什么？是否需要将其发送到服务器？