Javascript 在PHP中按按钮后多次运行和插入行数据的Ajax

我正在使用AJAX和PHP PDO插入一篇文章，并通过AJAX显示它，而无需重新加载页面。我有一个问题，当我点击post按钮时，消息会插入一次并显示出来。这是一个很好的过程，但在这之后，当我添加新消息并单击post按钮时，消息在数据库中插入了2次，并显示了相同的两次。同样，当我再次创建新消息时，消息会插入四次（我认为ajax在第一次插入后会运行很多次），但是如果我刷新页面并输入新消息，消息会插入并显示一次。这很好，但我不想刷新每个条目。 AJAX代码-

   $(document).on("click", "#save", function (e) {
           e.preventDefault();
                var message = $("#message").val();
                 var form_data = new FormData();
                form_data.append('message', message);
            
        var property = document.getElementById('photo').files;
         property = property[0];
if(property){
    var image_name = property.name;
    var image_extension = image_name.split('.').pop().toLowerCase();
    form_data.append("file",property);
}

var propertyv = document.getElementById('video').files;
         propertyv = propertyv[0];
if(propertyv){
    var name = propertyv.name;
    var extension = name.split('.').pop().toLowerCase();
    form_data.append("video",propertyv);
}
                //Ajax call to send data to the insert.php
                $.ajax({
                    type: "POST",
                    url: "insert_posts.php",
                    data: form_data,
                   contentType:false,
          cache:false,
          processData:false,
                    success: function (data) {
                        
                         $(data).insertAfter(".message-wrap:first");
                       
                        $("#message").val("");
                           $("#photo").val('');
                           $("#video").val('');

                              $('#body-bottom').hide();
                              $('#body-bottom-video').hide();
                                 $("#form")[0].reset();
                             

                    }
                });
            });

您可以看到第一条消息上面的图像正在插入一次，但是如果我创建一条新的第二条消息并单击post按钮，它将插入两次，然后相同的插入次数为-4次，接下来的条目插入8次。 我不想刷新，第二条消息应该像第一条消息一样插入一次

更多细节- ajax代码位于另一个JS文件中。我已经链接到index.php页面

<script src="ajax.js"></script>

尝试添加e.stopPropagation（）；在e.preventDefault（）之后

one（）方法对每种事件类型都很有用。 我已经改变了上面的路线

 $(document).one("click", "#save", function (e)  

现在，它起作用了

---

如需更多参考-

听起来像是您再次调用上述脚本及其调用

$（文档）。再次单击（“单击”、“保存”、

，重新构建代码或取消调用

（“单击”）

etcOk，但是如何检查它。我也更新了PHP脚本。你能检查并回答吗？请分享更多细节，以及你的调试尝试。如果错误仅仅通过重复的JS事件在你的浏览器中发生，这与PHP有关吗？如果它在

中，那么是的，当dom加载为你的脚本时，它会再次调用它每次在ResponsePP中返回它对于第一个条目来说都很有效，没有页面刷新，但是如果对于第二个条目，它在两行中输入两次并显示两次。我的意思是在两列中输入相同的消息。PHP服务器没有错误。我在e.preventDefault（）之后添加了ajax.js；e.stopPropagation（）；但是，它不起作用。同样的问题也发生了。