Скрыть Якорь на основе текста

Question

У меня есть следующая таблица:

<table class="k-tree-table"> 
<tbody> 
<tr><td class="fixedCell" cellGroup="SH"><a class="specialButton" cellGroup="RI">SH</a></TD></tr> 
<tr><td class="fixedCell" cellGroup="RI"><a class="specialButton" cellGroup="RI">EP</a></TD></tr> 
</table> 

Я хотел бы, чтобы скрыть якорный тег, который содержит текст «SH». Я попытался следующие, но он не может скрыть якоря:

$("a.specialButton:contains('SH')").hide(); 

Как я могу добраться до этого тега привязки и скрыть его с помощью JQuery?

Answer 1

Как уже упоминалось выше, код работает как задумано ,

Есть две причины, я могу думать о том, что могло бы объяснить, почему это не работает для вас:

1) Вы не ждущие DOM, который будет загружен, прежде чем пытаться скрыть ссылки. Как уже упоминалось, обязательно ждать, запустив это на готовом событии DOM, который может быть записан как, например:

$(function() { 
    $('a.specialButton:contains("SH")').hide(); 
}); 

2) Возможно, ваш стол становится заселена с некоторой AJAX вызова. Если это так, вам нужно запускать эту функцию каждый раз после заполнения таблицы. Кроме того, было бы неплохо сохранить ссылку на таблицу и фильтровать только через таблицу, а не всю вашу страницу. Это поможет повысить производительность.

var $table = $('table.k-tree-table'); 

// This would be your callback for the AJAX to populate the table 
function gotDataForTreeTable(data) { 
    // your code for populating table goes here 

    $table.find('a.specialButton:contains("SH")').hide(); 
} 

Надеюсь, это поможет и удачи.

Редактировать: Спасибо, что ответили правильно. Я не уверен, каковы ваши условия для скрытия ссылки, но сегодня я также понял, что вы, возможно, используете CSS без дополнительного Javascript.

td[cellGroup="SH"] a.specialButton { 
    display:none; 
} 

Answer 2

Ваш код действительно работает. Убедитесь, что вы запускаете jQuery код только после того, как DOM готов:

$(function() { 
 
    $('a.specialButton:contains("SH")').hide(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="k-tree-table"> 
 
<tbody> 
 
<tr><td class="fixedCell" cellGroup="SH"><a class="specialButton" cellGroup="RI">SH</a></td></tr> 
 
<tr><td class="fixedCell" cellGroup="RI"><a class="specialButton" cellGroup="RI">EP</a></td></tr> 
 
</tbody> 
 
</table>

Answer 3

Try ...

$(document).ready(function() { 
    $('a.specialButton:contains("SH")').hide(); 
});