Question

我有一个验证函数，它执行验证，到目前为止，下面的代码执行我想要的，传入所有$（'。required'）类然后循环遍历它们以检查它们的每个值。如果所有字段都至少有一个字符，则如果它们都不等于空字符串，则启用下一个按钮。

只是好奇是否有更好的方法来完成相同的任务，或者如果有人有任何速度性能增强也会非常感谢你！

validate : function (requiredArray) {
            var valueObj = {};
            for(var i = 0; i < requiredArray.length; i++) {
                valueObj[i] = 'input#'+requiredArray[i].id;
                $(valueObj[i]).on("keyup mouseup", function (e) {
                    for (var j = 0; j < Object.keys(valueObj).length; j++) {
                        if($(valueObj[j]).val() !== '') {
                            $('.btn-success.nextButton').removeClass('disabled');
                        } else {
                            $('.btn-success.nextButton').addClass('disabled');
                            return;
                        }
                    }
                });
            }
        }

Answer 1

如果您对所有输入使用公共类required，那么您可以尝试：

validate: function() {
  var $inputs = $('input.required'),
      $button = $('.btn-success.nextButton'),
      hasEmpty = $inputs.filter(function(){ return !this.value; }).length;

  $inputs.on('keyup mouseup', function() {
    if (hasEmpty) return false;
    $button.removeClass('disabled');
  });
}

我不确定您的结构是什么，但您应该将事件与验证逻辑分开，例如：

var $inputs = $('input.required'),
    $button = $('.btn-success.nextButton');

function validate() {   
  return $inputs.filter(function(){ return !this.value; }).length;  
}    

$inputs.on('keyup mouseup', function() {   
  if (!validate()) return false;   
  $button.removeClass('disabled');  
});

Id应该谨慎使用，课程更方便。

Answer 2

这就是我开始工作的方式：

$inputs.on('keyup mouseup', function() {  
    if (CMS.validate()) {
        $('.btn-success.nextButton').addClass('disabled');  
        return false; 
    }   
    $('.btn-success.nextButton').removeClass('disabled');  
        });

验证功能，并通过对象循环以找到更好的性能

2 个答案: