我在下面创建了一个非常简单的脚本,其中我提出了一个我似乎在 .each() documentation 中找不到的问题。 。如您所见,我想循环遍历 jQuery 对象的集合并返回 true
或 false
(如果其中一个为 false,则 .each 循环将中断,因此最终结果是假的)
由于某种原因,验证似乎无法正常工作。
$('.with-validation').on('submit', function (e) {
if (isValid()) {
console.log('validation succeded');
return true;
} else {
console.log('validation failed');
return false;
}
});
function isValid () {
var $required = $('.required');
var $emails = $('.email');
var inputsValidation = function () {
return $(this).val().length > 0;
}
$required.each(inputsValidation);
return inputsValidation;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<form class="with-validation">
<input name="lastname" class="required" type="text"></input>
<input name="firstname" type="text"></input>
<input name="phone" class="required" type="text"></input>
<input name="email" class="required email" type="text"></input>
<input name="confEmail" class="required email" type="text"></input>
<button class="submit-btn" type="submit">OK</button>
</form>
</body>
最佳答案
您可以使用Array.prototype.every
如果您的函数正在寻找有效条件。或者使用Array.prototype.some
具有检查无效条件的函数。 (如果您支持< IE9,请使用polyfill)
使用.toArray
将 jQuery
集合转换为数组。
您正在比较两个函数本身 inputsValidation && emailsValidation
而不是结果,而且 $each
也不会以这种方式返回结果。将结果获取到某些变量并比较结果,而不是函数本身。
$('.with-validation').on('submit', function (e) {
if (isValid()) {
console.log('validation succeded');
return true;
} else {
console.log('validation failed');
return false;
}
});
function isValid () {
var $required = $('.required').toArray();
var $emails = $('.email').toArray();
var emailsValidation = function (i) {
return validateEmail(i.value);
}
var inputsValidation = function (i) {
return i.value.length > 0;
}
var condition1 = $emails.every(emailsValidation);
var condition2 = $required.every(inputsValidation);
return condition1 && condition2;
}
function validateEmail(email) {
return true;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<form class="with-validation">
<input name="lastname" class="required" type="text"></input>
<input name="firstname" type="text"></input>
<input name="phone" class="required" type="text"></input>
<input name="email" class="required email" type="text"></input>
<input name="confEmail" class="required email" type="text"></input>
<button class="submit-btn" type="submit">OK</button>
</form>
</body>
关于javascript - 循环遍历 jQuery 对象并评估条件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42363943/