Question

我有几种形式，每种形式都有大约50多个输入字段。每个输入字段都有自己的验证检查。例如。

<div>
    <label>Birth Weight : </label>
    <div>
        <span class="addingUnits unitsGrams">
            <input id="birthWeightInGrams" class="form-control" onchange="validateBirthweight()" type="search" placeholder="eg. 1500" maxlength="4">
        </span>
    </div>
</div>

对于此验证：

function validateBirthweight(){
    var weight = document.getElementById('birthWeightInGrams').value;
    if(weight.length==0){
        toastr.error('Birth Weight - Value cannot be empty');
        $('#birthWeightInGrams').addClass('addRed')
        $('#birthWeightInGrams').removeClass('addGreen')
    }
    else if(isNaN(weight)){
            toastr.error('Birth Weight - Numbers only');
            $('#birthWeightInGrams').addClass('addRed')
            $('#birthWeightInGrams').removeClass('addGreen')
        }
    else if(weight>=1501 && weight<=5000){ 
            $('#birthWeightInGrams').removeClass('addRed')
            $('#birthWeightInGrams').addClass('addGreen')
        }
}

然后我将一个事件监听器应用于每个输入字段：

function InputsPatientForm(e){
    var inputsAllSelected = 0;
    $('#firstPanelID input[type=search]:visible:enabled').each(function(i) {
        if(!$(this).hasClass("addGreen") && !$(this).hasClass("addRed")){
           inputsAllSelected += 0;
           }
        else if($(this).hasClass("addGreen"))
            {
                 inputsAllSelected += 1;
            }
        else if($(this).hasClass("addRed")){
                 inputsAllSelected -= 1;
                }
    });
    return (inputsAllSelected)
}

我需要知道任何字段是否不正确然后我返回红色（如果它们包含他的类＆＃34; addRed＆＃34;。然后如果任何不完整则返回橙色（如果有）不是＆＃34; addRed＆＃34;或＆＃34; addGreen＆＃34;。如果ALL已完成（全部包含＆＃34; hasGreen＆＃34;）则返回绿色。的修改

除了使用这些添加和删除类之外，还有什么更好的方法来检查所有这些。

Answer 1

我很傻。我觉得这仍然是一个不错的验证检查。所以我创建了2个变量。

一个用于检查它是完整还是不完整。
一个用于检查是否有错误。

检查如下：

function InputsPatientForm(e){
        var completeIncompleteCounter = 0;
        var errorCounter = 0;
        $('#firstPanelID input[type=search]:visible:enabled').each(function(i) {
            if(!$(this).hasClass("addGreen") && !$(this).hasClass("addRed")){
               completeIncompleteCounter += 0;
               }
            else if($(this).hasClass("addGreen"))
                {
                     completeIncompleteCounter += 1;
                }
            else if($(this).hasClass("addRed")){
                     errorCounter += 1;
                    }
        });
        return [completeIncompleteCounter,errorCounter];
    }

如何在jQuery中检查输入字段是正确/不正确/不完整

1 个答案: