检查是否所有输入都为空(没有值)
Check if all inputs are empty (have no value)
我只是想快速拼凑一些东西,检查我的表单中的任何输入是否为空。
我正在尝试这个:
var isEmpty = true;
$('input').each(function(){
if($(this).val() === ""){
isEmpty = false;
}
});
alert(isEmpty);
但它一直在提醒真实。
如果我这样做:
$('input').each(function(){
alert($(this).val();
});
它会提醒我拥有的每个输入字段...
如果我有一个空输入,为什么它不返回 false?
这里有奖励:
一个小片段来检查所有文本inputs
都是空的:
var isEmpty = $("input[type='text']").filter(function () {
return this.value.trim();
}).length === 0;
console.log( isEmpty ); // boolean true/false
jsbin游乐场
PS:对于checkbox
和radio
游戏更简单:
var isUnchecked = $("input[type='checkbox']:checked").length === 0;
var isRadioUnchecked = $("input[type='radio']:checked").length === 0;
奖励::blank
自定义选择器(适用于任何元素(
jQuery.extend(jQuery.expr[':'], {
blank: function(e,i,m) {
if(/input|textarea/i.test(e.tagName)) {
if(/checkbox|radio/i.test(e.type)){
return !e.checked;
}else{
return !e.value.length;
}
}else{
return !e.innerHTML.trim();
}
}
});
$("div:blank").css({outline:"2px solid red"});
$("input:blank").css({outline:"2px solid red"});
$("textarea:blank").css({outline:"2px solid red"});
$("div:not(:blank)").css({outline:"2px solid green"}); // how cool is that? Using :not
*{margin:5px;padding:2px;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>
<div>Example using :not(:blank) selectors</div>
<input type="text" value="abc">
<input type="text" value="">
<input type="checkbox">
<input type="checkbox" checked>
<input type="radio" checked>
<input type="radio">
<textarea></textarea>
<textarea>abc</textarea>
在 <div>
或 <p>
等标准元素上,:blank
的行为与 jQuery 的:empty
选择器不同,因为请注意空格和换行符:
<p>
</p>
并查看结果:
$("p:blank").length // 1 (found one blank paragraph)
$("p:empty").length // 0 there's no empty paragraph (since the newlines/spaces)
回到你的问题:)
由于您正在循环所有元素,因此目前您仅将 isEmpty
的值设置为循环中的最后一个元素 - value。
您可以将布尔标志断言到if
中,例如:
var isEmpty = false; // start with a falsy presumption
$('input').each(function(){
// as long as `isEmpty` is `false`
if(isEmpty===false && $.trim( this.value ) === "") {
isEmpty = true;
}
});
此外,检查空虚做=== ""
更有意义,返回true
否则,反之亦然,就是颠倒你的否定
var isEmpty = true; // start with a truthy presumption
$('input').each(function(){
if(isEmpty && $.trim( this.value )){
isEmpty = false;
}
});
下面是一个活生生的例子:
var isEmpty = true; // start with a truthy presumption
$('input').each(function(){
if(isEmpty && $.trim( this.value )){
isEmpty = false;
}
});
alert(isEmpty); // false
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="">
<input type="text" value="something">
<input type="text" value="">
alert
在循环之外,所以它只会提醒最终值。希望下面的代码有用
.HTML
<input type="text" id=" " value="rdrdr"/>
<input type="text" id=" " value=" "/>
<input type="text" id=" " value="xdxd"/>
<input type="text" id=" " value=" "/>
.JS
$('input').each(function(){
var isEmpty = true;
if($.trim($(this).val()) == ""){
isEmpty = false;
}
console.log(isEmpty)
});
Chexk在这里演示
在代码中,您要检查:
if($(this) === "")
但$(this)
是一个 jQuery 对象,它永远不会与空字符串相同。也许你打算写这个?
if ($(this).val() === "")
您需要检查每个输入的 val((,因此请记住获取要比较的值:
if ( $(this).val() === "" )
尝试先初始化变量,不包含任何值。然后在某个范围时放置一个值并调用它。
var isEmpty;
$('input').each(function(){
if($(this) === ""){
var isEmpty = false;
return isEmpty;
alert(isEmpty);
} else {
var isEmpty = true;
return isEmpty;
alert(isEmpty);
}
});
相关文章:
- 是否可以将一个函数输入连接到另一个函数调用的文本
- 是否可以为HTML5输入滑块触发oninput事件
- 使用onkeyup JS事件检查输入的值是否唯一
- 是否可以从输入处理程序中确定输入的类型
- angularJs检查是否输入
- Angularjs-检查我是否输入并切换加载程序图标
- javascript 警报以确认值是否输入了两次
- 检查是否输入了文本.找不到错误
- 提交前验证表单(检查是否输入了所有字段)
- 在JSF+PrimeFaces中重置表单之前,请检查是否输入了一些强制输入字段
- 检查是否输入了正确的电子邮件
- 检测以前是否输入过
- 如何检查数字输入字段中是否输入了字母字符或符号
- 搜索小部件-如何确定是否“输入”已按下或已选择结果
- 如何知道用户是否输入了已注册的有效电子邮件地址
- ASP.Net MVC Razor引擎:让javascript函数知道用户是否输入了无效数据
- jQuery如何判断用户是否输入'& # 39;在文本输入区
- 如何检测是否输入了两个输入元素,如文本字段.(php / javascript)
- 如何知道用户是否输入了无效的$routeparams
- Select2 -告诉用户是否输入了新的搜索选项