javascript - 如何验证 jquery 中的文本值

Question

我有一个模式弹出窗口。其中存在两个字段:“已接收数量”和“总数量”。如果任何人输入“接收数量”，那么它会从 jquery 中使用“总数量”进行验证。

总数量来自数据库。而且它是隐藏的。

• 条件 1:收到的数量不得大于总数量。
• 条件2:收到的数量不得少于1。
• 条件3:收到的数量不应为小数。它只应该是 整数。

$("#update-receivings").click(function() {

  var received_quantity1 = $.trim($('#received_quantity').val());
  var total_quantity1 = $.trim($('#total_quantity').val());
  var intRegex = /^[1-9]\d*$/;

  if (received_quantity1 > total_quantity1) {
    alert('bad>');
    $('.error1').show();
    $('.error2').hide();
    $('#received_quantity1').val('');

  } else if (received_quantity1 < '1') {
    alert('bad<');
    $('.error1').show();
    $('.error2').hide();
    $('#received_quantity1').val('');
  } else if (!received_quantity1.match(intRegex)) {
    alert('badr');
    $('.error2').show();
    $('.error1').hide();
    $('#received_quantity1').val('');
  } else {
    alert('good');
    //$('#drug-receive-form').submit();
  }


});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="form-horizontal" method="POST" id="drug-receive-form">
  <div class="modal-body">
    <!--<div class="form-group">
                        <div class="col-sm-12">
                           <input type="password" name="supply_code" id="supply_code" class="form-control">
								<span class="text-red" id="otp-error"></span>
                        </div>
                    </div>-->
    <input type="hidden" name="total_quantity" id="total_quantity"> Received Quantity:&nbsp;<input type="text" name="received_quantity" id="received_quantity"><br>
    <span class="error1" style="color: Red; display: none">* Received Quantity Should not be greater than Available Quantity and should not less than 1</span>
    <span class="error2" style="color: Red; display: none">* Loose Quantity is not acceptable.</span>
  </div>
  <div class="modal-footer">
    <div class="text-left">
      <!--<button type="button" name="update-receivings" id="update-receivings" class="btn btn-info">Submit</button>-->
      <button type="button" name="update-receivings" id="update-receivings" class="btn btn-info">Yes  </button>
      <!--<button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>--->
      <button type="button" class="btn btn-danger" data-dismiss="modal">Not Now </button>
    </div>
  </div>
</form>

它不工作。如果总数量为 45 并且我输入收到数量 5.5，那么它将处于第一个条件。它匹配大于 45 的 5.5。

Answer 1

使用 parseInt javascript 函数来比较数字。

var received_quantity1 = parseInt($.trim($('#received_quantity').val()));
var total_quantity1 = parseInt($.trim($('#total_quantity').val()));