javascript - JQuery - 在类选择器中使用多个变量

Question

我正在尝试使用来自用户输入的多个变量来连接一个类选择器。我得到一个空数组作为答案。

用户输入从下拉菜单中捕获并保存为变量:

var changed1 = $("#dropdown1-ddl option:selected").text();
var changed2 = $("#dropdown2-ddl option:selected").text();

根据列表项是否具有该特定类显示结果列表。

$("ul li").hide();    
$("ul li ."+changed1+"."+changed2).parent().show();

列表的设置使其从数据库中提取所有信息，并将搜索词存储在每个 li 标签下方的 div 标签中的类中。因此， parent 的表现。

<ul>
<li>
    <div class="value1"></div>
    <div class="value2"></div>
</li>
<li>
    <div class="value1"></div>
    <div class="value2"></div>
</li> 
</ul>

JQuery 应该在 div 中搜索与搜索词匹配的所有 div 并显示它们。

目前我可以提取用户输入并将其保存为变量。我可以很好地搜索一个变量，但是添加第二个变量会一直给出一个空数组(如果我只是一个 console.log 来输出连接的结果，至少这是结果。

Answer 1

您的选择器当前表示 li 的某个子元素在ul必须有两个类changed1和 changed2等于。

但是由于每个div只有一个类，你可以试试下面的方法:

$("ul li").has('.' + changed1).filter(':has(.' + changed2 +')').show();

这将过滤出第一个 li，其中包含一个 div，其类的值为 changed1 ，并进一步过滤(li 的)列表，以查找那些也具有类值为 changed2 的 div 的列表。 , 然后显示匹配两者的那些 li。

我不确定这是最有效的方法，但它确实有效。

我用来测试的简单 jsFiddle:http://jsfiddle.net/DCqwH/