Question

我有一个html表单，我希望突出显示通过jquery选择的字段。这样做我用这种方式做了

<select id="s1">
 <option value="">--</option>
 <option value="1">1</option>
 <option value="2" selected>2</option>
 <option value="3">3</option>
</select>

<select id="s2">
 <option value="">--</option>
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3">3</option>
</select>

<select id="s3">
 <option value="">--</option>
 <option value="1" selected>1</option>
 <option value="2">2</option>
 <option value="3">3</option>
</select>

etc..

JS

if ($("select#s1 option:selected").prop("value") != '') {
 $("select#s1").addClass("blu-border");
}

if ($("select#s2 option:selected").prop("value") != '') {
 $("select#s2").addClass("blu-border");
}

if ($("select#s3 option:selected").prop("value") != '') {
 $("select#s3").addClass("blu-border");
}

etc..

我想知道是否可以仅对所有选定的输入字段使用一个命令来执行此操作。像这样我用来重置所有表单字段。

$(":input").prop('selectedIndex', 0);

由于

Answer 1

您需要检查所选选项值是否为空白，所以

$('select').removeClass('add').filter(function () {
    console.log(this, this.value)
    return this.value != ''
}).addClass('add')

演示：Fiddle

或

$('select').removeClass('add').has('option:selected[value!=""]').addClass('add')

演示：Fiddle

注意：在我的测试用例中，removeClass（）用于删除以前添加的类。

jquery在所有选定的输入上添加类

1 个答案: