javascript - 多个复选框一键提交php表单

Question

有没有办法改善这一点？找不到改善的方法。。

var $submit = $('#submit-form');
   $submit.off('click').on('click', function(e) {
       e.preventDefault();

       var checkedBOX = $('#checkboxes').find('input:checked');
       var servers = [];
       $.each(checkedBOX, function(k, v) {
           var v = $(v);

           servers.push(v.val());

           v.prop("checked", false);
       });

       var doneCount = 0;
       $.each(servers, function(key, server) {
           $.ajax({
           type: "POST",
           url: window.location.href,
           data: $('#form').serialize() + '&server=' + server + '&submit=',
           success: function (data) {
               doneCount++;

               if (doneCount >= servers.length) {
                   window.location.reload();
               }
           }
           })
       });
   });

无法弄清楚什么是让它更快的最佳方法..有人可以帮我吗？

标签： javascriptjqueryajaxforms

Answer 1

试试这个方法，去掉循环

 $(document).on('submit','#submit-form',function(e){
           e.preventDefault();
    
           var checkedBOX = $('#checkboxes').find('input:checked');
           var servers = [];
            $("input:checkbox[name=checkbox]:checked").each(function(){
              servers.push($(this).val());
            });
  
              console.log(servers);
              
             $.ajax({
               type: "POST",
               url: window.location.href,
               data: $('#submit-form').serialize() + '&server=' + servers + '&submit=',
               success:function(data){
                  window.location.reload();
               }
             });
           
       });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<form method="POST" id="submit-form">
<input type="text" name="name" placeholder="NAME"/>
<br/>
<input type="text" name="email" placeholder="EMAIL"/>
<br/>

<input type="checkbox" name="checkbox" value="1" />
<input type="checkbox" name="checkbox" value="2" />
<input type="checkbox" name="checkbox" value="3" />
<input type="checkbox" name="checkbox" value="4" />
<br/>
<button type="submit">SUBMIT</button>
</form>