Question

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

假设我有以下代码：

使用Javascript：

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

我想在括号内的信息中找到哪些（$ firstname，$ lastname等）为true，然后允许它更改该特定变量的css，以便我可以照亮输入字段以显示它没有输入信息。

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

Click on JSFiddle to see code

Answer 1

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

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

JS Fiddle demo

显然，更改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 Fiddle demo

其次，更简洁的方法与上述方法相同：

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

JS Fiddle demo

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

参考文献：

Answer 2

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

$('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/

在if语句中查找不正确的特定参数？

2 个答案: