使用 jQuery 在列中搜索特定文本的表格行

Searching a table row for specific text in a COLUMN with jQuery

提问by Victor

I found this question on StackOverflowthat has a very nice answer, but being a beginner, I want a more detailed explanation, because my situation is a bit different: I have a table like the one below:

我在 StackOverflow 上发现 这个问题有一个很好的答案，但作为初学者，我想要更详细的解释，因为我的情况有点不同：我有一张如下表：

 ________________________________________________
 | id |     name     | age |      location      |
 |----+--------------+-----+--------------------|
 |  1 | Victor       | 14  | Bucharest, Romania |
 |  2 | John         | 17  | New York, USA      |
 |  3 | Steve        | 12  | New York, USA      |
 |  7 | Michael      | 37  | Washington DC, USA |
 |  9 | Michaela     | 25  | Washington DC, USA |
 |----+--------------+-----+--------------------|

The id of the person is in my database (MySQL database) set to AUTO_INCREMENT, so if I delete a record, it will be like the last one in my table here (from 7 to 9). I want to search the row that has the personId = 3in my HTML table.

该人的 id 在我的数据库（MySQL 数据库）中设置为AUTO_INCREMENT，因此如果我删除一条记录，它将像这里表中的最后一条（从 7 到 9）。我想搜索personId = 3在我的 HTML 表中包含 的行。

So, based on the question in my link, how can I refine that search to be only in the ID column?

因此，根据我的链接中的问题，我如何才能将该搜索细化为仅在 ID 列中？

Edit for @yeyene:

为@yeyene 编辑：

This is the function based on your code. Actually, I don't need to change the background color of the row, I need the row's index for using it later with .eq(index)to make some operations on it:

这是基于您的代码的功能。实际上，我不需要更改行的背景颜色，我需要行的索引以便稍后使用它并.eq(index)对其进行一些操作：

function findTableRow(personId){
    $('#people tr').each(function(){
        if($(this).find('td').eq(0).text() == personId){
            return (row's index?)
        }
    }); 
}

回答by yeyene

Check here, DEMO http://jsfiddle.net/yeyene/wAxNu/

在这里查看，演示http://jsfiddle.net/yeyene/wAxNu/

$(document).ready(function(){
    $('table tr').each(function(){
        if($(this).find('td').eq(0).text() == '3'){
            $(this).css('background','red');
        }
    });
});

回答by Pieter

You can achieve that with your database query:

您可以通过数据库查询来实现：

SELECT (id, name, age, location) FROM table WHERE id = 3;

If you want to use filters on page, you can you the first answer of your posted question:

如果你想在页面上使用过滤器，你可以在你发布的问题的第一个答案中：

var tableRow = $("td").filter(function() {
    return $(this).text() === "3";
}).closest("tr");

Explanation:

解释：

1. Make a var tableRow
2. Find all cells with $("td")
3. Filter the found cells based on a function, this is testing whether the content of the cell is equal to '3'. $(this)refers to the cell, .text()outputs the text content.
4. closest("tr")is added to select the trwhere the tdis placed in.
5. If you want to do something with that row, you can do this: tablerow.hide().

1. 做一个 var tableRow
2. 查找所有单元格 $("td")
3. 根据函数过滤找到的单元格，这是测试单元格的内容是否等于'3'。$(this)引用单元格，.text()输出文本内容。
4. closest("tr")被添加到选择tr其中td放置英寸
5. 如果你想要做的事与此列，你可以这样做：tablerow.hide()。

To hide all rows, but not the selected row, use this code:

要隐藏所有行，但不隐藏所选行，请使用以下代码：

$('tr').not(tableRow).hide();

Working demo:http://jsfiddle.net/hzW2a/

工作演示：http : //jsfiddle.net/hzW2a/