javascript - 选择任意 tr 和/或 td 并隐藏元素

Question

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

我有一个有几行的表。有些在单元格中有名称，有些则有上传 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

Answer 1

一些创意过滤和查找。

$(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 应该是唯一的。