只運行一次腳本

Question

我有這樣的表格：

<form method="POST" action="bubble2.php" id="bubbleName">
    <input id="myInput" name="namehere" type="text">
    <input name="submit" type="submit">  
</form>

以及防止提交后重定向或重新加載頁面的腳本：

<script>
$(document).ready(function(){
   $('form').submit(function(e){
    e.preventDefault();

        $.ajax({
            type: 'POST',
            url: 'bubble.php',
            data: $('form').serialize(),
            success: function(data) {

                 $('#bubbleName')[0].reset();

            }
        });

   });
});
</script>

我需要的是腳本在提交后只運行一次。

Answer 1

您可以為此使用一個：

<script>
$(document).ready(function(){
   $('form').one('submit', function(e){
    e.preventDefault();

        $.ajax({
            type: 'POST',
            url: 'bubble.php',
            data: $('form').serialize(),
            success: function(data) {

                 $('#bubbleName')[0].reset();

            }
        });

   });
});
</script>

Answer 2

首先，將類名或 id 添加到提交按鈕，然后添加 EventListener

 <form method="POST" action="bubble2.php" id="bubbleName">
   <input id="myInput" name="namehere" type="text">
   <input name="submit" type="submit" class="btn">  
 </form>

document.querySelector(".btn").addEventListener("click",function(){

  //enter your code here

};