jQuery - 查找包含包含特定文本的表格单元格的表格行

时间:2022-01-02 22:15:56

I need to get a tr element which contains a td element which contains specific text. The td will contain that text and only that text (so I need text = 'foo' not text contains 'foo' logic).

我需要得到一个tr元素,其中包含一个包含特定文本的td元素。 td将包含该文本而只包含该文本(因此我需要text ='foo'而不是text包含'foo'逻辑)。

So I need the equivalent of the following 'pseudo jQuery':

所以我需要等效的以下'伪jQuery':

var tableRow = $(table td[text = 'foo']).parent('tr');

Can anyone provide the correct syntax?

有人能提供正确的语法吗?

5 个解决方案

#1


82  

You can use filter() to do that:

你可以使用filter()来做到这一点:

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

#2


34  

I know this is an old post but I thought I could share an alternative [not as robust, but simpler] approach to searching for a string in a table.

我知道这是一个老帖子,但我想我可以分享另一种[不那么强大,但更简单]的方法来搜索表格中的字符串。

$("tr:contains(needle)"); //where needle is the text you are searching for.

$( “TR:包含(针)”); //其中needle是您要搜索的文本。

For example, if you are searching for the text 'box', that would be:

例如,如果您要搜索文本“框”,那将是:

$("tr:contains('box')");

This would return all the elements with this text. Additional criteria could be used to narrow it down if it returns multiple elements

这将返回包含此文本的所有元素。如果返回多个元素,可以使用其他标准来缩小范围

#3


14  

$(function(){
    var search = 'foo';
    $("table tr td").filter(function() {
        return $(this).text() == search;
    }).parent('tr').css('color','red');
});

Will turn the text red for rows which have a cell whose text is 'foo'.

对于具有文本为'foo'的单元格的行,将文本变为红色。

#4


2  

This will search text in all the td's inside each tr and show/hide tr's based on search text

这将在每个tr内的所有td中搜索文本,并根据搜索文本显示/隐藏tr

 $.each($(".table tbody").find("tr"), function () {                              

                if ($(this).text().toLowerCase().replace(/\s+/g, '').indexOf(searchText.replace(/\s+/g, '').toLowerCase()) == -1)
                    $(this).hide();
                else
                    $(this).show();
 });

#5


0  

   <input type="text" id="text" name="search">
<table id="table_data">
        <tr class="listR"><td>PHP</td></tr>
        <tr class="listR"><td>MySql</td></tr>
        <tr class="listR"><td>AJAX</td></tr>
        <tr class="listR"><td>jQuery</td></tr>
        <tr class="listR"><td>JavaScript</td></tr>
        <tr class="listR"><td>HTML</td></tr>
        <tr class="listR"><td>CSS</td></tr>
        <tr class="listR"><td>CSS3</td></tr>
</table>

$("#textbox").on('keyup',function(){
        var f = $(this).val();
      $("#table_data tr.listR").each(function(){
            if ($(this).text().search(new RegExp(f, "i")) < 0) {
                $(this).fadeOut();
             } else {
                 $(this).show();
            }
        });
    });

Demo You can perform by search() method with use RegExp matching text

演示您可以使用RegExp匹配文本通过search()方法执行

#1


82  

You can use filter() to do that:

你可以使用filter()来做到这一点:

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

#2


34  

I know this is an old post but I thought I could share an alternative [not as robust, but simpler] approach to searching for a string in a table.

我知道这是一个老帖子,但我想我可以分享另一种[不那么强大,但更简单]的方法来搜索表格中的字符串。

$("tr:contains(needle)"); //where needle is the text you are searching for.

$( “TR:包含(针)”); //其中needle是您要搜索的文本。

For example, if you are searching for the text 'box', that would be:

例如,如果您要搜索文本“框”,那将是:

$("tr:contains('box')");

This would return all the elements with this text. Additional criteria could be used to narrow it down if it returns multiple elements

这将返回包含此文本的所有元素。如果返回多个元素,可以使用其他标准来缩小范围

#3


14  

$(function(){
    var search = 'foo';
    $("table tr td").filter(function() {
        return $(this).text() == search;
    }).parent('tr').css('color','red');
});

Will turn the text red for rows which have a cell whose text is 'foo'.

对于具有文本为'foo'的单元格的行,将文本变为红色。

#4


2  

This will search text in all the td's inside each tr and show/hide tr's based on search text

这将在每个tr内的所有td中搜索文本,并根据搜索文本显示/隐藏tr

 $.each($(".table tbody").find("tr"), function () {                              

                if ($(this).text().toLowerCase().replace(/\s+/g, '').indexOf(searchText.replace(/\s+/g, '').toLowerCase()) == -1)
                    $(this).hide();
                else
                    $(this).show();
 });

#5


0  

   <input type="text" id="text" name="search">
<table id="table_data">
        <tr class="listR"><td>PHP</td></tr>
        <tr class="listR"><td>MySql</td></tr>
        <tr class="listR"><td>AJAX</td></tr>
        <tr class="listR"><td>jQuery</td></tr>
        <tr class="listR"><td>JavaScript</td></tr>
        <tr class="listR"><td>HTML</td></tr>
        <tr class="listR"><td>CSS</td></tr>
        <tr class="listR"><td>CSS3</td></tr>
</table>

$("#textbox").on('keyup',function(){
        var f = $(this).val();
      $("#table_data tr.listR").each(function(){
            if ($(this).text().search(new RegExp(f, "i")) < 0) {
                $(this).fadeOut();
             } else {
                 $(this).show();
            }
        });
    });

Demo You can perform by search() method with use RegExp matching text

演示您可以使用RegExp匹配文本通过search()方法执行