只允許三個按鈕，一個提交Web表單

Question

如果我有這樣的：

<form method="post" id="customForm" action=""> 
    //stuff 

    <div id="copiar"> 
     <button class="button" href="#" id="btnAdd0"> 
      <span class="icon icon3">&nbsp;</span> 
     </button> 
     <button class="button" href="#" id="btnDel0"> 
      <span class="icon icon58">&nbsp;</span> 
     </button> 
     <button class="submeter"> 
      <span class="label">Send</span> 
     </button> 
    </div> 
    </form> 

和：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#customForm").submit(function() { 
      var formdata = $("#customForm").serializeArray(); 
      $.ajax({ 
       url: "validation.php", 
       type: "post", 
       dataType: "json", 
       data: formdata, 
       success: function(data, data1) { 
        //stuff 
      }); 
      return false; 
     }); 
    }); 
</script> 

目前，三個按鈕發送表單。我的想法是隻允許在此按鈕提交行動：

<button class="submeter"> 
    <span class="label">Send</span> 
</button> 

我已經嘗試過$("#customForm > #copiar > button.submeter").submit(function() { 但重新加載頁面。所以不工作。

有什麼想法？

Answer 1

您必須先停止其他按鈕，然後再提交。還使用ID時，你的選擇是不是真的有任何需要它像#customForm>另一個ID #copiar「

結合起來試試這個：

$(document).ready(function() { 
    $("#customForm").submit(function(e) { 
     e.preventDefault(); 
     var formdata = $("#customForm").serializeArray(); 
     $.ajax({ 
      url: "validation.php", 
      type: "post", 
      dataType: "json", 
      data: formdata, 
      success: function(data, data1) { 
       //stuff 
      } 
     }); 
    }); 
    $("#customForm button").click(function(e) { 
     var me = $(this); 
     e.preventDefault(); 

     if(me.hasClass("submeter")) $("#customForm").submit(); 
    }); 
}); 

正如已經指出的那樣，你並不需要/想在href =「＃」

Answer 2

爲了防止形式的默認行爲，則必須使用preventDefault()如下：

$(document).ready(function() { 
    $("#customForm").submit(function(e) { 
     e.preventDefault(); 
     var formdata = $("#customForm").serializeArray(); 
     $.ajax({ 
      url: "validation.php", 
      type: "post", 
      dataType: "json", 
      data: formdata, 
      success: function(data, data1) { 
       //stuff 
     }); 
    }); 
    $("#customForm button.submeter").click(function() { 
     $("#customForm").submit(); 
    }); 
}); 

Answer 3

究竟是什麼前兩個按鈕元件與href目的屬性？我懷疑你使用的是按鈕而不是常規鏈接，僅用於格式化/視覺原因。

無論如何，爲了您的目的，只需將屬性type =「submit」添加到最後一個按鈕並移除您爲此按鈕定義的提交處理程序，它應該可以正常工作。

編輯。您還需要調用preventDefault（）方法來停止頁面重新加載，正如Phil Klein所指出的