Question

$('.button).click(function(){
  var idArr = [22, 35, 37, 52]

  for(var i = 0; i < idArr.length; i++) {
     var selector = 'form#basic-cart-add-to-cart-quantity-form-'+idArr[i];
     $(selector).submit();  
  }
});

我尝试将产品添加到订购购物车。但提交后我只有id = 52的最后一个产品。

表单示例（其他表单是相同的HTML代码，它们与表单的ID不同）：

<div class="button basic-cart-add-to-cart-link">Add to cart</div>

<form action="/products" method="post" id="basic-cart-add-to-cart-quantity-form-37" accept-charset="UTF-8">
  <div>
    <input type="hidden" name="nid" value="37">
    <div class="form-item form-type-textfield form-item-quantity">
      <input type="text" id="edit-quantity" name="quantity" value="0" size="5" maxlength="128" class="form-text" style="border-color: rgb(189, 159, 87);">
    </div>
    <button id="edit-submit" name="op" value="Add to cart" type="submit" class="form-submit">Add to cart</button>

    <input type="hidden" name="form_build_id" value="form-XkBpnV4sDZRlhJHkRXZtShRRIzwP2oulCEWML6iwXGo">
    <input type="hidden" name="form_token" value="ImZ8RCj2apjZsSJV4-lgkSDEj4IOUG5fjDy3KdLwJjY">
    <input type="hidden" name="form_id"  value="basic_cart_add_to_cart_quantity_form_37">
  </div>
</form>

如何通过点击一个btn添加所有产品＆＃34;添加到购物车＆＃34;在表格中提交其他按钮？

Answer 1

您需要在表单提交处理程序中添加event.preventDefault

$('form#basic-cart-add-to-cart-quantity-form-52').submit(function(e){
    console.log('form#basic-cart-add-to-cart-quantity-form-52');
    e.preventDefault();

    })

＆＃13;

$(function(){
$('.button').click(function(){

  var idArr = [22, 35, 37, 52];
  var speed=1000;
  for(var i = 1; i <= idArr.length; i++) {
        setTimeout(function(y) {
          
          var selector = 'form#basic-cart-add-to-cart-quantity-form-'+y;
     $(selector).submit();
        }, speed*i, idArr[i-1]);
          
   
     
  }
  for (var i = 0; i < idArr.length; i++) {
    $('form#basic-cart-add-to-cart-quantity-form-' + idArr[i]).‌submit(function(e) {
        console.log('form#basic-cart-add-to-cart-quantity-form-'‌ + idArr[i]);
        e.preventDefault();
    });
}
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="button basic-cart-add-to-cart-link">Add to cart</div>

<form action="/products" method="post" id="basic-cart-add-to-cart-quantity-form-37" accept-charset="UTF-8">
  <div>
    <input type="hidden" name="nid" value="37">
    <div class="form-item form-type-textfield form-item-quantity">
      <input type="text" id="edit-quantity" name="quantity" value="0" size="5" maxlength="128" class="form-text" style="border-color: rgb(189, 159, 87);">
    </div>
    <button id="edit-submit" name="op" value="Add to cart" type="submit" class="form-submit">Add to cart</button>

    <input type="hidden" name="form_build_id" value="form-XkBpnV4sDZRlhJHkRXZtShRRIzwP2oulCEWML6iwXGo">
    <input type="hidden" name="form_token" value="ImZ8RCj2apjZsSJV4-lgkSDEj4IOUG5fjDy3KdLwJjY">
    <input type="hidden" name="form_id"  value="basic_cart_add_to_cart_quantity_form_37">
  </div>
</form>


<form action="/products" method="post" id="basic-cart-add-to-cart-quantity-form-22" accept-charset="UTF-8">
  <div>
    <input type="hidden" name="nid" value="22">
    <div class="form-item form-type-textfield form-item-quantity">
      <input type="text" id="edit-quantity" name="quantity" value="0" size="5" maxlength="128" class="form-text" style="border-color: rgb(189, 159, 87);">
    </div>
    <button id="edit-submit" name="op" value="Add to cart" type="submit" class="form-submit">Add to cart</button>

    <input type="hidden" name="form_build_id" value="form-XkBpnV4sDZRlhJHkRXZtShRRIzwP2oulCEWML6iwXGo">
    <input type="hidden" name="form_token" value="ImZ8RCj2apjZsSJV4-lgkSDEj4IOUG5fjDy3KdLwJjY">
    <input type="hidden" name="form_id"  value="basic_cart_add_to_cart_quantity_form_22">
  </div>
</form>


<form action="/products" method="post" id="basic-cart-add-to-cart-quantity-form-35" accept-charset="UTF-8">
  <div>
    <input type="hidden" name="nid" value="37">
    <div class="form-item form-type-textfield form-item-quantity">
      <input type="text" id="edit-quantity" name="quantity" value="0" size="5" maxlength="128" class="form-text" style="border-color: rgb(189, 159, 87);">
    </div>
    <button id="edit-submit" name="op" value="Add to cart" type="submit" class="form-submit">Add to cart</button>

    <input type="hidden" name="form_build_id" value="form-XkBpnV4sDZRlhJHkRXZtShRRIzwP2oulCEWML6iwXGo">
    <input type="hidden" name="form_token" value="ImZ8RCj2apjZsSJV4-lgkSDEj4IOUG5fjDy3KdLwJjY">
    <input type="hidden" name="form_id"  value="basic_cart_add_to_cart_quantity_form_35">
  </div>
</form>


<form action="/products" method="post" id="basic-cart-add-to-cart-quantity-form-52" accept-charset="UTF-8">
  <div>
    <input type="hidden" name="nid" value="37">
    <div class="form-item form-type-textfield form-item-quantity">
      <input type="text" id="edit-quantity" name="quantity" value="0" size="5" maxlength="128" class="form-text" style="border-color: rgb(189, 159, 87);">
    </div>
    <button id="edit-submit" name="op" value="Add to cart" type="submit" class="form-submit">Add to cart</button>

    <input type="hidden" name="form_build_id" value="form-XkBpnV4sDZRlhJHkRXZtShRRIzwP2oulCEWML6iwXGo">
    <input type="hidden" name="form_token" value="ImZ8RCj2apjZsSJV4-lgkSDEj4IOUG5fjDy3KdLwJjY">
    <input type="hidden" name="form_id"  value="basic_cart_add_to_cart_quantity_form_52">
  </div>
</form>

<button class="button">Click</button>

＆＃13;

Answer 2

尝试.click（）

$('.button').click(function(){
 var idArr = [22, 35, 37, 52]

 for(var i = 0; i < idArr.length; i++) {
   var selector = 'form#basic-cart-add-to-cart-quantity-form-'+idArr[i];
   $(selector).click();  
 }
});

Answer 3

有一个名为 .trigger 的事件。

这里引用了jQuery关于此事件的文档：

.trigger（）执行附加到给定事件类型的匹配元素的所有处理程序和行为。

以下是符合您需求的示例：

$('.button').click(function(){
  var idArr = [22, 35, 37, 52]
  for(var i = 0; i < idArr.length; i++) {
    var selector = 'form#basic-cart-add-to-cart-quantity-form-'+idArr[i];
    $(selector).trigger("submit");  
  }
});

（有关.trigger的详细信息，请访问：http://api.jquery.com/trigger/）

按钮单击其他按钮

3 个答案: