Question

我创建了一个IMS系统。在那里，在订单页面上，我必须在生成订单之前验证产品数量。所以为此，我使用jquery选择器来比较两个值，除非第二个字段的值小于或等于第一个字段提交按钮将被启用，每当值超过它时，按钮将被禁用。（第一个字段是库存可用，第二个字段是在创建订单时给出的库存）。但当我输入第二个产品验证不起作用时，此代码仅适用于第一个产品。如何将此代码放入循环中，我可以检查订单中的每个产品。添加新产品时，行的ID会自动递增。以下是我的代码

<td>
    <input type="text" name="qty[]" id="qty_1" class="form-control" disabled autocomplete="off">
    <input type="hidden" name="qty_value[]" id="qty_value_1" class="form-control" autocomplete="off">
   </td>
  <td><input type="text" name="aqty[]" id="aqty_1" class="form-control" required onkeyup="getTotal(1)"></td>

的Javascript

<script type="text/javascript">
   $('#qty_value_1,#aqty_1').on('keyup', function() {
                  var btn = $('button:contains("Submit")');
                  if (parseFloat($('#qty_value_1').val()) >= parseFloat($('#aqty_1').val())) {
                      btn.prop('disabled', false);
                  } else {
                      btn.prop('disabled', true);
                  }
              })
</script>

我的主要目的是在生成订单之前检查每个产品数量

Answer 1

你可以在html one div或...中使用多个类。

<div class="container classname classname classname">

</div>

Answer 2

您需要使用 CSS属性选择器。它使用方括号。对于您的情况，您需要选择以 aqty _ 开头的id - s，因此您必须将选择器定义为[id^="aqty_"]

您的脚本可能如下所示

<script type="text/javascript">
  var btn = $('button:contains("Submit")');
  $('[id^="aqty_"]').on('keyup', function() {
          var qty_val = $(this).closest('tr').find('[id^="qty_value_"]');
          if (parseFloat(qty_val.val()) >= parseFloat($(this).val())) {
              $(this).removeClass("warn");
          } else {
                $(this).addClass("warn");
          }
     btn.prop('disabled', $('.warn').length);
  });
</script>

由于您有多个商品需要填写订单，因此只有当所有订单数量都不超过商店价值时，您才需要关注启用按钮。因此，好的方法是定义类.warn，它会出现错误的字段值。脚本的最后一步必须是使用类.warn检查一长串元素。如果此长度大于零，则某个值超出其限制，否则所有输入都是正确的，并且提交按钮将变为启用状态。

查看链接的工作原理：jsfiddle link

如何给单个html元素赋予多个类

2 个答案: