使用jQuery检查是否所有表单输入都为空
使用jQuery检查是否所有表单输入都为空
提问于 2012-05-09 21:40:13
我正在尝试验证一个联系人表单，我想创建某种类型的‘表单已完成’消息，一旦每个输入字段都填好了(一些输入是文本框，一些是单选按钮)。
到目前为止，我的代码如下：
$(document).ready(function() {
$('.form:input').each(function() {
if ($(this).val() != "") {
$('.congrats').css("display", "block");
}
});
});p.congrats {
display: none;
}<div class="form">
<input type="text" />
<br />
<input type="text" />
</div>
<p class="congrats">Congrats!</p>
回答 6
Stack Overflow用户
回答已采纳
发布于 2012-05-09 21:46:05
这应该可以让你开始：
$(document).ready(function() {
$(".form > :input").keyup(function() {
var $emptyFields = $('.form :input').filter(function() {
return $.trim(this.value) === "";
});
if (!$emptyFields.length) {
console.log("form has been filled");
}
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form">
<input type="text" /><br />
<input type="text" />
</div>
<p class="congrats"></p>
Stack Overflow用户
发布于 2012-05-09 21:47:15
试试这个：
$("#a").on('click',function () {
var bad=0;
$('.form :text').each(function(){
if( $.trim($(this).val()) == "" ) bad++;
});
if (bad>0) $('.congrats').css("display","block").text(bad+' missing');
else $('.congrats').hide();
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form">
<input type="text" /><br />
<input type="text" />
</div>
<p class="congrats"></p><input style="width:100px" value="check" id="a" type="button" />
Stack Overflow用户
发布于 2014-08-05 02:07:23
它使用了jQuery的serializeArray函数，所以您不必担心检查不同类型的字段或哪些字段符合空字段：
$.fn.isBlank = function() {
var fields = $(this).serializeArray();
for (var i = 0; i < fields.length; i++) {
if (fields[i].value) {
return false;
}
}
return true;
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/10517315
复制相关文章
相似问题