0

假设我正在制作一个注册表单。现在我希望它突出显示四个字段中的空白字段。现在我可以只做一堆 if-else 语句，但这需要很长时间。

假设我有以下代码：

Javascript：

if($firstname === "" || $lastname==="" || $email ==="" && $phone === ""){
        //What goes here?
    }

我想在括号内的信息中找出其中哪些（$firstname、$lastname 等）是正确的，然后允许它更改该特定变量的 css，以便我可以照亮输入字段以显示它的信息尚未输入。

现有代码：http: //jsfiddle.net/EVkge/

Click on JSFiddle to see code
4

2 回答 2

3

您过于复杂了，只需使用addClass()匿名函数：

$('input').addClass(function () {
    return this.value == '' ? 'empty' : '';
});

JS 小提琴演示。

显然，将empty类名更改为您希望拥有的任何类名；正如您可能已经猜到的那样，''以下:是一个空字符串，如果this.value不等于（之前的评估）将返回。''?

如评论中所述，如果能够在相关input元素变为非空时删除添加的类，那就更好了；考虑到这一点，一个简单的方法应该是显而易见的：

$('input:button').click(function () {
    $('input').each(function () {
        var that = $(this),
            val = that.val();
        if (val === '') {
            that.addClass('empty');
        } else {
            that.removeClass('empty');
        }
    });
});

JS 小提琴演示。

其次，一种更简洁的方法，等效于上述方法：

$('input:button').click(function () {
    $('input').each(function(){
        $(this)[this.value == '' ? 'addClass' : 'removeClass']('empty');
    });
});

JS 小提琴演示。

这利用了这样一个事实，即可以使用符号形式Object.propertyName和访问对象的方法Object['propertyName']，还可以使用在这些方括号中运行条件（三元）运算符来确定是否应该使用addClass()or方法来处理下面括号中提供的类名。removeClass()empty

参考：

于 2013-03-05T00:26:11.887 回答
1

您可以遍历字段并检查每个字段是否为空，如上所述添加一个类。

$('input:button').click(function () {
    $('input[type="text"]').each(function (indx) {
        var $currentField = $(this);
        if( $currentField.val() == '' ) {
            $currentField.addClass('empty');
        } else {
            $currentField.removeClass('empty');
        }
    });
});

我还为您添加了一些额外的功能：http: //jsfiddle.net/jeffpowrs/Wzj8M/1/

于 2013-03-05T00:43:55.517 回答