爲什麼Ajax表單提交兩次？

爲什麼下面的腳本會導致表單提交兩次？即使在互聯網上發佈其他解決方案後，我也無法弄清楚。提交兩次會導致數據庫中出現重複條目。預先感謝您對此進行調查！爲什麼Ajax表單提交兩次？

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#form-error').hide(); 
    $("#form-submit").click(function(){ 
     $("#form").submit(); 
    }); 
}); 

$('#form').submit(function(e) { 
      register(); 
    e.preventDefault(); 
    }); 

function register() 
{    
    jQuery.ajax({ 
     method: 'POST', 
     url: 'actions/add.php', 
     data: $('#form').serialize(), 
     dataType:'json', 
     success: function(msg){ 

      if(parseInt(msg.status)==1) 
      { 
       window.location=msg.txt; 
      } 
      else if(parseInt(msg.status)==0) 
      { 
       error(1,msg.txt); 
      } 
     } 
    }); 

}    

function hideshow(el,act) 
    { 
    if(act) 
     { 
     $('#'+el).hide(0).slideDown(500, 'linear'); 
     } 
    else $('#'+el).hide(); 
    } 

function error(act,txt) 
    { 
    if(txt) 
     { 
     $('#form-error').html(txt); 
     } 
    $('#form-error').hide(0).slideDown(500, 'linear'); 
    } 
</script>

HTML表單：

<form id="form"> 
      <p>First Name:</p> 
      <input type="text" name="firstname" /> 
      <p>Last Name:</p> 
      <input type="text" name="lastname" /> 
      <p>E-Mail Address:</p> 
      <input type="text" name="emailaddress" /> 
      <p>Sequence Assignment:</p> 
      <select name="sequence"> 
       <option value="1">Default Sequence</option> 
      </select> 
      <button id="form-submit">Add User</button> 
      <p id="form-error"></p> 
</form>

來源

2015-10-11 Alex Parker

$（「＃形式」）提交（）;和Query.ajax（{0}} {方法：'POST'， –

有用於提交事件重複的事件監聽器：

1.提交按鈕點擊：

$("#form-submit").click(function(){ 
    $("#form").submit(); 
});

2.當表單提交：

$('#form').submit(function(e) { 
      register(); 
    e.preventDefault(); 
});

你只需要一個其中。

更改您的代碼，如：

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#form-error').hide(); 
    $('#form').submit(function(e) { 
     register(); 
     e.preventDefault(); 
    }); 
}); 

function register() 
{ 
    . 
    . 
    .

來源

2015-10-11 05:05:24 ryubro

已經工作了！非常感謝！Javascript並不是我的專長，你可以告訴我，再次感謝！ –

不客氣：） – ryubro

我有一個類似的問題這一點。如果你只是單擊按鈕，它會輸入重複的數據？

我得到的方式是點擊發生後，我禁用了按鈕，直到Ajax調用。

function register() 
{  
    //disable button   
    jQuery.ajax({ 
     method: 'POST', 
     url: 'actions/add.php', 
     data: $('#form').serialize(), 
     dataType:'json', 
     success: function(msg){ 

      if(parseInt(msg.status)==1) 
      { 
       window.location=msg.txt; 
      } 
      else if(parseInt(msg.status)==0) 
      { 
       error(1,msg.txt); 
      } 
     } 
    }); 
    //Enable Button 
}

另一種選擇是在php代碼中進行一些檢查，將它提交給數據庫以查看數據是否已經存在。

來源

2015-10-11 05:04:40

爲什麼Ajax表單提交兩次？

回答

相關問題