使用jQueryselect空的文本input
如何识别使用jQuery的空文本框？ 如果可能的话，我想用select器来做。 另外，我必须selectid，因为在我想要使用的实际代码中，我不想select所有文本input。
在我的下面两个代码示例中，第一个代码准确地显示用户input到文本框“txt2”中的值。 第二个例子确定有一个空的文本框，但是如果你填写它仍然认为它是空的。 为什么是这样？
这可以通过select器来完成吗？
此代码报告文本框“txt2”中的值：
<html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function() { $('#cmdSubmit').click(function() { alert($('[id=txt2]').val()); }); }); </script> </head> <body> <form> <input type="text" name="txt1" id="txt1" value="123" /><br /> <input type="text" name="txt2" id="txt2" value="" /><br /> <input type="text" name="txt3" id="txt3" value="abc" /><br /> <input type="submit" name="cmdSubmit" id='cmdSubmit' value="Send" /><br /> </form> </body> </html> 此代码始终将文本框“txt2”报告为空：
<html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function() { $('#cmdSubmit').click(function() { if($('[id^=txt][value=""]').length > 0) { if (!confirm("Are you sure you want to submit empty fields?")) { if (event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; } } } }); }); </script> </head> <body> <form> <input type="text" name="txt1" id="txt1" value="123" /><br /> <input type="text" name="txt2" id="txt2" value="" /><br /> <input type="text" name="txt3" id="txt3" value="abc" /><br /> <input type="submit" name="cmdSubmit" id='cmdSubmit' value="Send" /><br /> </form> </body> </html>
其他方式
$('input:text').filter(function() { return $(this).val() == ""; });
要么
$('input:text').filter(function() { return this.value == ""; });
要么
// WARNING: if input element does not have the "value" attribute or this attribute was removed from DOM then such selector WILL NOT WORK! // For example input with type="file" and file does not selected. // It's prefer to use "filter()" method. // Thanks to @AaronLS $('input:text[value=""]');
工作演示
代码从演示
jQuery的
$(function() { $('#button').click(function() { var emptyTextBoxes = $('input:text').filter(function() { return this.value == ""; }); var string = "The blank textbox ids are - \n"; emptyTextBoxes.each(function() { string += "\n" + this.id; }); alert(string); }); });
你也可以通过定义你自己的select器来做到这一点：
$.extend($.expr[':'],{ textboxEmpty: function(el){ return $(el).val() === ""; } });
然后像这样访问它们：
alert($(':text:textboxEmpty').length); //alerts the number of text boxes in your selection
$(":text[value='']").doStuff();
？
顺便说一句，你的电话：
$('input[id=cmdSubmit]')...
可以大大简化和加速：
$('#cmdSubmit')...
正如在排名最高的职位中提到的，下面的工作与Sizzle引擎。
$('input:text[value=""]');
在注释中，注意到删除select器的:text部分会导致select器失败。 我相信发生的事情是Sizzle实际上依赖于浏览器内置的select器引擎。 何时:text被添加到select器，它成为一个非标准的CSSselect器，因此必须由Sizzle自己处理。 这意味着Sizzle将检查INPUT的当前值，而不是在源HTML中指定的“value”属性。
所以这是一个聪明的方法来检查空的文本字段，但我认为它依赖于Sizzle引擎的特定行为（即使用INPUT的当前值而不是源代码中定义的属性）。 虽然Sizzle可能会返回与此select器匹配的元素，但document.querySelectorAll将只返回HTML中具有value=""元素。 买者自负。
$("input[type=text][value=]")
尝试了很多版本后，我发现这是最合乎逻辑的。
请注意， text区分大小写。
这里有很多答案表明类似[value=""]但我不认为这真的有效。 。 。 或者至less，使用情况不一致。 我正在尝试做类似的事情，select所有的input都是以某个string开头的，也没有input值。 我试过这个：
$("input[id^='something'][value='']")
但它不起作用。 也没有扭转他们。 看到这个小提琴 。 唯一的方法，我发现正确select所有input的ID以string开头，没有input值是
$("input[id^='something']").not("[value!='']")
和
$("input[id^='something']:not([value!=''])")
但显然，双重否定使这真的很混乱。 Russ Cam的第一个答案（带过滤function）可能是最清晰的方法。
基于@詹姆斯·怀斯曼的回答，我正在使用这个：
$.extend($.expr[':'],{ blank: function(el){ return $(el).val().match(/^\s*$/); } });
这将捕获只包含空白的input，除了那些真正为空的input。
例如： http : //jsfiddle.net/e9btdbyn/
我build议：
$('input:text:not([value])')
这将select以“txt”开头的空白文本input：
$(':text[value=""][id^=txt]')
