jQuery神秘问题

我尝试使用一个通用的验证函数，但我认为长度validatinon有一个问题：该函数在第二个输入中工作，但在第一个输入中不工作，您可以在JSFIDLE上看到：

Html：

    <input type="text" name="number" class="verify" conditions="requierd numeric"/>
    <input type="text" name="number2" class="verify" conditions="requierd lenght:5 numeric"/>

javascript：

function getVal(field, array){
            arr = jQuery.grep(array, function (value) {
                search = field;
                if(value.match(search)) return true;
                return false;
            });
            var vals = arr[0].split(':');
            return vals[1];
        }
        $('.verify').blur(function(){
            var conditions = $(this).attr('conditions').split(' ');
            var state = [];
            if ($.inArray('requierd', conditions) > -1){
                if($(this).val() === '') state.push('invalid');
                else state.push('valid');
            }
            else $(this).removeClass('invalid').addClass('valid');
            if ($.inArray('numeric', conditions) > -1){
                if($.isNumeric($(this).val()) === false) state.push('invalid');
                else state.push('valid');
            }
            if(getVal('lenght', conditions) != ''){
                if($(this).val().length < getVal('lenght', conditions)) state.push('invalid');
                else state.push('valid');
            }
            if(($.inArray('invalid', state) > -1) === false){
                $(this).removeClass('invalid').addClass('valid');
                verif();
            }
            else{
                $(this).removeClass('valid').addClass('invalid');
            }
        });

        function verif(){
            var state = 'none';
            $('.verify').each(function(){
                if($(this).hasClass('invalid')) state = 'invalid';
            });
            if(state != 'invalid'){
                //VALID !
                $('body').append('VALIDATED');
            }
        }

函数getVal（字段，数组）{ arr=jQuery.grep（数组，函数（值）{ 搜索=字段； if（value.match（search））返回true； 返回false； }); var vals=arr[0]。拆分（“：”）； 返回VAL[1]； } $（'.verify'）.blur（函数（）{ var conditions=$（this.attr（'conditions'）.split（''）； var状态=[]； 如果（$.inArray（'required'，条件）>-1）{ if（$（this.val（）=''）state.push（'invalid'）； else state.push（'valid'）； } else$（this）.removeClass（'invalid'）.addClass（'valid'）； 如果（$.inArray（'数字'，条件）>-1）{ if（$.isNumeric（$（this.val（））==false）state.push（'invalid'）； else state.push（'valid'）； } 如果（getVal（'lenght'，条件）！=“”）{ if（$（this.val（）.length-1）==false）{ $（this）.removeClass（'invalid'）.addClass（'valid'）； verif（）； } 否则{ $（this）.removeClass（'valid'）.addClass（'invalid'）； } }); 函数verif（）{ 变量状态='无'； $（'.verify'）。每个（函数（）{ if（$（this）.hasClass（'invalid'））状态='invalid'； }); 如果（状态！=“无效”）{ //有效！ $（'body'）。追加（'VALIDATED'）； } }

---

除了我上面的评论之外，我还提出了一个非常快速的解决方案

如果您真的不想使用一些现有的客户端验证库，那么如果您不想经常遇到这样的问题，您应该进一步清理代码

---

此外，您可能希望使用JSFIDLE中的“JsLint”按钮来查找代码中的错误。

检查长度的部分。第一个输入字段根本没有定义长度，如果没有长度定义，则getVal方法将终止。