如何提交表单而不知道buttonID /类或表单ID /类?

嗨,我有一个单一的页面中有多个不同的forms每个这是从后端得到不同的productId,每个窗体有2个button一个添加产品一个删除产品。 如果他们点击“+”button,它必须在JavaScript中的“如果”条件,如果他们点击“ – ”button,它必须在JavaScript的“其他”条件

这是我的HTML

<form> <input type="hidden" class="form-control" name="productCatalogId" value="<%= data.productDetails[i].productCatalogId %>"> <input type="hidden" class="form-control" name="productquantity" value="<%= data.productDetails[i].productQuantity %>"> <button type="button" value="addition" class="btn btn-primary btn-sm">+</button> <h4> <%= data.productDetails[i].productQuantity %> </h4> <button type="button" value="substraction" class="btn btn-primary btn-sm">- </button> </form> 

像这样我有一些forms!

和我的JavaScript

 $(':button').click(function(e) { e.preventDefault(); var updateOrder = $(this.form).serializeArray(); dataObj = {}; $(updateOrder).each(function(i, field) { dataObj[field.name] = field.value; }); console.log(dataObj['productquantity']); var orderId = $("#orderid").val(); updateOrder.push({ name: "orderId", value: orderId, }); // console.log($(':button').val()); if ($(':button').val() == 'addition') { var quantity = parseInt($("input[name=productquantity]").val()) + 1; } else { var quantity = parseInt($("input[name=productquantity]").val()) - 1; } updateOrder.push({ name: "quantity", value: quantity, }); // console.log(updateOrder); $.ajax({ url: '/order/updateorderitems', type: 'POST', data: updateOrder, success: function(response) { if (response.success) { // console.log(response); } } }); // console.log(productData); }); 

每当我点击任何button,它将'如果条件'只! 任何人都可以请build议我,我做错了什么?

这个问题是因为在你的if语句中你正在使用:buttonselect器。 当与val()结合使用时,它只能从匹配集中的第一个:button元素读取。

要解决此问题,请在事件处理函数中使用this关键字来仅引用被单击的button。 尝试这个:

 if ($(this).val() == 'addition') { var quantity = parseInt($("input[name=productquantity]").val(), 10) + 1; } else { var quantity = parseInt($("input[name=productquantity]").val(), 10) - 1; } 

另外请注意,这可以更简洁,如下所示:

 var quantity = parseInt($("input[name=productquantity]").val(), 10) $(this).val() == 'addition' ? quantity++ : quantity--;