选择任何 TR 和/或 TD 并隐藏元素

select any tr and/or td and hide an element

本文关键字：TD 隐藏 元素 任何 TR 选择      更新时间：2023-09-26

我试图在这里找到答案，但无法完成！

我有一张有几行的桌子。有些在单元格中有一个名称，有些则有上传 ID。这样：

<tr>
 <td>blabla</td>
 <td>Name: Messi</td>
 <td><a id="upload-button" href=".."/>button</a></td>
 <td>blabla</td>
</tr>
<tr>
 <td>blabla</td>
 <td>upload id: 123456</td>
 <td><a id="upload-button" href=".."/>button</a></td>
 <td>blabla</td>
</tr>
<tr>
 <td>blabla</td>
 <td>upload id: 654321</td>
 <td><a id="upload-button" href=".."/>button</a></td>
 <td>blabla</td>
</tr>

我试图找到每个带有name的 td。只是name这个词，而不是name: messi.如果该单词存在，则在下一个 td 中隐藏#upload-button。我真的想不通。

我所拥有的就是这个，两者都不起作用。有人可以帮我解决这个问题吗？

$('tr:has(td:contains("name"))').closest('#upload-button').hide(); //doesnt work

    $("tr td:contains('name')").each(function(){
      $(this).siblings('td').css("visibility","hidden");
    });//doesnt work

一些创造性的过滤和查找。

$(function(){
     $('tr td').filter(function(){
        return $(this).text().toLowerCase().indexOf('name')>-1;
      }) // first find only the td's containing the text you want
      .parent() // step up to the tr
      .find('a') // find the `a` - only because you've duplicated id's. This could be any selector
      .hide();  // hide it
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
 <td>blabla</td>
 <td>Name: Messi</td>
 <td><a id="upload-button" href=".."/>button</a></td>
 <td>blabla</td>
</tr>
<tr>
 <td>blabla</td>
 <td>upload id: 123456</td>
 <td><a id="upload-button" href=".."/>button</a></td>
 <td>blabla</td>
</tr>
<tr>
 <td>blabla</td>
 <td>upload id: 654321</td>
 <td><a id="upload-button" href=".."/>button</a></td>
 <td>blabla</td>
</tr>
</table>

小心：id 应该是唯一的。

您可以尝试以下方法：

$('td').each(function(){
    //check if contains 'name'
    if( this.innerHTML.toLowerCase().indexOf( 'name' ) !== -1 ) {
        // I think next is better as siblings -> selects only the button td
        //$(this).siblings('td').css("visibility","hidden");
        $(this).next('td').css("visibility","hidden");
    }
});

编辑根据评论添加了.toLowerCase();-）

相关文章：