使用 jQuery 选择空文本输入 | 选择空文本输入

本文介绍了使用 jQuery 选择空文本输入的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

如何使用 jQuery 识别空文本框?如果可能的话，我想使用选择器来做到这一点.另外，我必须在 id 上进行选择，因为在我想要使用它的实际代码中，我不想选择所有文本输入.

How do I identify empty textboxes using jQuery? I would like to do it using selectors if it is at all possible. Also, I must select on id since in the real code where I want to use this I don't want to select all text inputs.

在我下面的两个代码示例中，第一个示例准确地显示了用户在文本框txt2"中输入的值.第二个例子识别出有一个空的文本框，但如果你把它填进去，它仍然认为它是空的.这是为什么呢?

In my following two code examples the first one accurately displays the value typed into the textbox "txt2" by the user. The second example identifies that there is an empty textbox, but if you fill it in it still regards it as empty. Why is this?

这可以只使用选择器来完成吗?

Can this be done using just selectors?

此代码报告文本框txt2"中的值:

This code reports the value in textbox "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"报告为空:

This code always reports textbox "txt2" as empty:

<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 -
";

    emptyTextBoxes.each(function() {
      string += "
" + this.id;
    });
    alert(string);
  });

});

这篇关于使用 jQuery 选择空文本输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！