jQuery—简单的输入验证—“空”和“非空”

I have an input that I want to validate:

我有一个输入要验证:

<input type="text" id="input" />

And here's the JS:

这是JS:

        jQuery("#input").live('change', function() {

            if("#input:not(:empty)") {
                alert('not empty');
            }   

            else if("#input:empty") {
                alert('empty'); 
            }
        });

Even when the "#input" is empty there's no way of displaying alert with "empty" message. So, basically, no matter what I do, only the first statement is true and the second is false, always.

即使“#input”是空的，也没有办法用“empty”消息显示警报。所以，基本上，不管我做什么，只有第一个表述是正确的第二个总是错误的。

What's wrong?

怎么了?

4 个解决方案

#1

JQuery's :empty selector selects all elements on the page that are empty in the sense that they have no child elements, including text nodes, not all inputs that have no text in them.

JQuery:empty selector选择页面上所有为空的元素，因为它们没有子元素，包括文本节点，而不是所有没有文本的输入。

Jquery: How to check if an input element has not been filled in.

Jquery:如何检查输入元素是否没有被填充。

Here's the code stolen from the above thread:

以下是从上面的线程偷来的代码:

$('#apply-form input').blur(function()          //whenever you click off an input element
{                   
    if( !$(this).val() ) {                      //if it is blank. 
         alert('empty');    
    }
});

This works because an empty string in JavaScript is a 'falsy value', which basically means if you try to use it as a boolean value it will always evaluate to false. If you want, you can change the conditional to $(this).val() === '' for added clarity. :D

这之所以有效，是因为JavaScript中的空字符串是一个“falsy值”，这基本上意味着，如果您试图将它用作布尔值，它将始终计算为false。如果需要，可以将条件改为$(this).val() === "，以增加清晰度。:D

#2

You could do this

你可以这样做

$("#input").blur(function(){
    if($(this).val() == ''){
        alert('empty'); 
    }
});

http://jsfiddle.net/jasongennaro/Y5P9k/1/

When the input has lost focus that is .blur(), then check the value of the #input.

当输入失去焦点时，即.blur()，然后检查#input的值。

If it is empty == '' then trigger the alert.

如果为空== "，则触发警报。

#3

    jQuery("#input").live('change', function() {
        // since we check more than once against the value, place it in a var.
        var inputvalue = $("#input").attr("value");

        // if it's value **IS NOT** ""
        if(inputvalue !== "") {
            jQuery(this).css('outline', 'solid 1px red'); 
        }   

        // else if it's value **IS** ""
        else if(inputvalue === "") {
            alert('empty'); 
        }

    });

#4

Actually there is a simpler way to do this, just:

实际上有一种更简单的方法:

if ($("#input").is('empty')) {
console.log('empty');
} else {
console.log('not empty');
}

#1