jQuery:在tr满足多个条件的地方选择tr [英] jQuery: select tr's where td's meeting multiple criterias

问题描述

我想知道，是否有可能从<table>满足多个条件的<table>中选择<tr>.例如(请参阅末尾的示例表):

获取所有<tr>，其中第一列为"Audi" AND ，第二列为 红色"

我已经找到了如何按一个柱子进行过滤的方法:

$('tr:has(td:nth-child(1):contains("Audi"))').doSomeThing();

但是我的问题是如何使用 AND 条件进行过滤，例如:

$('tr:has(td:nth-child(1):contains("Audi") && td:nth-child(2):contains("red"))').doSomeThing();

我知道有多重属性选择器，但由于我是搜索.text()属性不适合我的问题.

我的样品表:

<table id="list">
<tr>
    <td>Audi</td>
    <td>red</td>
</tr>
<tr>
    <td>Audi</td>
    <td>yellow</td>
</tr>
<tr>
    <td>Audi</td>
    <td>green</td>
</tr>
<tr>
    <td>BMW</td>
    <td>red</td>
</tr>
<tr>
    <td>BMW</td>
    <td>yellow</td>
</tr>
<tr>
    <td>BMW</td>
    <td>green</td>
</tr>
    ...
</table>

感谢您的帮助！

解决方案

使用filter方法根据其他条件来缩小初始选择范围.

$('tr:has(td:nth-child(1):contains("Audi"))').filter(':has(td:nth-child(2):contains("red"))').doSomeThing();

如果您正在寻找一个选择器，则可读性较差:

$('tr:has(td:nth-child(1):contains("Audi")):has(td:nth-child(2):contains("red"))').doSomeThing();

这是一个演示: http://jsfiddle.net/8Mnsf/2/

您还可以通过以下方法来提高可读性:

$('tr')
    .has('td:nth-child(1):contains("Audi")')
    .has('td:nth-child(2):contains("red")')
    .doSomeThing();

I was wondering, whether it's possible to select <tr>'s from a <table> where <td>'s meets multiple conditions. For example (see sample table at the end ):

Get all <tr>'s where first column is "Audi" AND second column is "red"

I've allready find out how to filter by one collumn:

$('tr:has(td:nth-child(1):contains("Audi"))').doSomeThing();

But my problem is how to filter with an AND condition like:

$('tr:has(td:nth-child(1):contains("Audi") && td:nth-child(2):contains("red"))').doSomeThing();

I know that there is the Multiple Attribute Selector, but since i'm searching for the .text() property it's not apropriate for my problem.

My sample table:

<table id="list">
<tr>
    <td>Audi</td>
    <td>red</td>
</tr>
<tr>
    <td>Audi</td>
    <td>yellow</td>
</tr>
<tr>
    <td>Audi</td>
    <td>green</td>
</tr>
<tr>
    <td>BMW</td>
    <td>red</td>
</tr>
<tr>
    <td>BMW</td>
    <td>yellow</td>
</tr>
<tr>
    <td>BMW</td>
    <td>green</td>
</tr>
    ...
</table>

Thanx for your help!

解决方案

Use the filter method to narrow down your initial selection based on other conditions.

$('tr:has(td:nth-child(1):contains("Audi"))').filter(':has(td:nth-child(2):contains("red"))').doSomeThing();

If you're looking for a single selector, here is the less readable:

$('tr:has(td:nth-child(1):contains("Audi")):has(td:nth-child(2):contains("red"))').doSomeThing();

Here is a demonstration: http://jsfiddle.net/8Mnsf/2/

You could also improve readability somewhat by going for:

$('tr')
    .has('td:nth-child(1):contains("Audi")')
    .has('td:nth-child(2):contains("red")')
    .doSomeThing();

这篇关于jQuery:在tr满足多个条件的地方选择tr的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！