Jquery 如何获取特定输入值的元素？

我有元素

.touser

，它是一个输入文本字段，值为

car

if($("#compose-child-container-1").find(".tousers").val()=="car") {

                                    }

---

我想

addClass

到

.tousers

元素，但如何选择它呢？

一个简单的解决方案是查看每个

.tousers

元素

$("#compose-child-container-1 .tousers").each(function() {
    if($(this).val() == 'car') $(this).addClass('className');
});

---

注意：

[value=“car”]

不适用于用户修改的值。因此，循环几乎是唯一的解决方案。

一个简单的解决方案是查看每个

元素

$("#compose-child-container-1 .tousers").each(function() {
    if($(this).val() == 'car') $(this).addClass('className');
});

注意：
[value=“car”]
不适用于用户修改的值。因此，循环几乎是唯一的解决方案。
使用
$（this）
。在函数中，应使用
$（选择器）。每个（函数（）{//code}
使用
$（此）
。在函数中，应使用
$（选择器）。每个（函数（）{//code}
尝试以下操作：

$('#compose-child-container-1 .tousers').each(function() {
    var el = $(this);
    if (el.val() == 'car') {
        el.addClass('found');
    }
});

试试这个：

$('#compose-child-container-1 .tousers').each(function() {
    var el = $(this);
    if (el.val() == 'car') {
        el.addClass('found');
    }
});

在这里，属性选择器将不起作用，因为一旦用户修改了输入字段中的值，属性就不会更新，只有dom元素属性才会更新

我要做的是

$("#compose-child-container-1").find(".tousers").filter(function(){
    return this.value == 'car'
}).addClass('someclass')

在这里，属性选择器将不起作用，因为一旦用户修改了输入字段中的值，属性就不会更新，只有dom元素属性才会更新

我要做的是

$("#compose-child-container-1").find(".tousers").filter(function(){
    return this.value == 'car'
}).addClass('someclass')

我将使用：

这将查找元素的逻辑与您实际想要对其执行的操作（本例中为addClass）分离开来。
我将使用：

这将查找元素的逻辑与您实际想要对其执行的操作（本例中为addClass）分开。
如果您确定最多有一个
。tousers
元素：

var $_tousers = $('#compose-child-container-1 .tousers');
if ($_tousers.val() == 'car') $_tousers.addClass('found');

但是，如果有多个值，则如果第一个值为“car”，则将在所有值上设置该类，而不考虑其他值

或者，如果您想对它说点轻快的话，您可以创建一个自定义选择器来测试元素的当前值

$.expr[':'].value = function(obj, index, meta, stack) {
    console.log(meta);
    var candidateValue = meta[3];
    return (candidateValue === $(obj).val());
};

...

$('#compose-child-container-1 .tousers:value(car)').addClass('found');

尽管这需要构建一个新的选择器来测试不同的值

$.expr[':'].value = function(obj, index, meta, stack) {
    console.log(meta);
    var candidateValue = meta[3];
    return (candidateValue === $(obj).val());
};

...

$('#compose-child-container-1 .tousers:value(car)').addClass('found');

或者，你可以有一个插件

$.fn.withVal = function(val) {
    return this.filter(function() { return this.value == val; });
}

...

$('#compose-child-container-1 .tousers').withVal('car').addClass('found');

请注意，扩展jQuery（使用自定义选择器或插件）只有在您想多次使用它时才真正有价值。
如果您确定最多只有一个
。Touser
元素：

var $_tousers = $('#compose-child-container-1 .tousers');
if ($_tousers.val() == 'car') $_tousers.addClass('found');

但是，如果有多个值，则如果第一个值为“car”，则将在所有值上设置该类，而不考虑其他值

或者，如果您想对它说点轻快的话，您可以创建一个自定义选择器来测试元素的当前值

$.expr[':'].value = function(obj, index, meta, stack) {
    console.log(meta);
    var candidateValue = meta[3];
    return (candidateValue === $(obj).val());
};

...

$('#compose-child-container-1 .tousers:value(car)').addClass('found');

尽管这需要构建一个新的选择器来测试不同的值

$.expr[':'].value = function(obj, index, meta, stack) {
    console.log(meta);
    var candidateValue = meta[3];
    return (candidateValue === $(obj).val());
};

...

$('#compose-child-container-1 .tousers:value(car)').addClass('found');

或者，你可以有一个插件

$.fn.withVal = function(val) {
    return this.filter(function() { return this.value == val; });
}

...

$('#compose-child-container-1 .tousers').withVal('car').addClass('found');

请注意，扩展jQuery（使用自定义选择器或插件）只有在您想多次使用它的情况下才是真正值得的。
试试这个，它既快速又干净：

$("#compose-child-container-1").find(".tousers").filter(function () { 
   return this.value === 'car';
}).addClass('your-class');

试试这个，它又快又干净：

$("#compose-child-container-1").find(".tousers").filter(function () { 
   return this.value === 'car';
}).addClass('your-class');

您仍然可以使用
filter（）
而不是显式循环。好的。因此，只有当页面第一次加载时，value为car时，它才可能工作？@OptimusPrime-是。它对用户输入值不起作用。对于加载到DOM中的值，它会工作。@DennisMartinez-Check-现在在第一个文本框中键入“car”。您仍然可以使用
filter（）
而不是显式循环。好的。因此，只有当页面第一次加载时值为car时，它才可能工作？@OptimusPrime-是。它对用户输入值无效。对于加载到DOM中的值，它会工作。@DennisMartinez-Check-现在在第一个文本框中键入“car”。