選擇任何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

您可以嘗試以下操作：

$('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() ;-)

Answer 2

進行一些創造性的過濾和查找。

 $(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應該是唯一的。