Question

<input type="text" readonly="" value="0" class="input-mini1 sum1"> 
<input type="text" readonly="" value="0" class="input-mini1 sum2">
<input type="text" readonly="" value="0" class="input-mini1 sum3">
<button type="button" id="btn_submit" class="btn">Submit</button>

尝试解决方案：

$("#btn_submit").click(function(){
    var isFormValid = true;

    $(".input-mini1 input").each(function(){
      if ($.trim($(this).val()).length == 0){
         alertify.error("Please check hours");
         isFormValid = false;
      }else{
      alertify.error("Valid hours");
      }
     });

     if (!isFormValid) alert("Please fill in all the required fields (indicated by *)");
    return isFormValid;
});

出于某种原因，当我提交填写为空/零的表单时，它不会验证。如果输入值为0或0.0（任何一种情况）并且应该验证，用户不得提交表格。

此外，当点击提交按钮时，它不会循环输入。

任何想法如何使其发挥作用？

Answer 1

您的选择器.input-mini1 input错误，它正在查找input个元素，这些元素是类input-mini1的元素的后代。

它应该是input.input-mini1，因为input-mini1是输入元素的类

所以

$("input.input-mini1").each(function () {
    if ($.trim($(this).val()).length == 0) {
        alertify.error("Please check timesheet hours");
        isFormValid = false;
    } else {
        alertify.error("Valid timesheet hours");
    }
});

Answer 2

应该是因为类input-mini1附加到您的输入元素itslef。

$("input.input-mini1").each(function(){
//    |        |
// " tag . className "

.input-mini1 input会找到班级input

的子input-mini1元素

要验证0值，请使用Number或parseInt / parseFloat作为.val()返回string。您的代码使用length检查空输入。

if (Number($.trim($(this).val())) == 0){
     alert("Please check timesheet hours");
     isFormValid = false;
  }

最终代码：

$("#btn_submit").click(function(){
    var isFormValid = true;

    $("input.input-mini1").each(function(){
      var inpValue = $.trim($(this).val());
      if (!inpValue.length || Number(inpValue) == 0){
          alertify.error("Please check hours");
          isFormValid = false;
      }else{
          alertify.error("Valid hours");
      }
    });

     if (!isFormValid) alert("Please fill in all the required fields (indicated by *)");
    return isFormValid;
});

jQuery检查提交时输入为空（0）

2 个答案: