Ответ 1
Попробуйте использовать код без инструкции if
, что совершенно не нужно в этом контексте.
$(".sonuc").has("span:contains('text1')").parent().addClass('hobi')
HTML:
<div class="views-row views-row-10 views-row-even views-row-last">
<div class="sonuc">
<span>text1</span>
</div>
</div>
<div class="views-row views-row-11 views-row-even views-row-last">
<div class="sonuc">
<span>text2</span>
</div>
JS:
if ($(".sonuc").has(":contains('text1')").length) {
$('.sonuc').parent().addClass('hobi')
}
Его работа, но добавьте hobi
класс для всех родительских div. Но я хочу добавить только родительский div text1. Как я могу это исправить?
Попробуйте использовать код без инструкции if
, что совершенно не нужно в этом контексте.
$(".sonuc").has("span:contains('text1')").parent().addClass('hobi')
Вы можете использовать селектор :contains
и необходимый селектор div:
$('.views-row:contains(text1)').addClass('hobi');
jquery selector : contains() соответствует любому элементу, содержащему строку. Я предлагаю использовать .filter():
$(".sonuc span").filter(function() {
return this.innerText === "text1";
}).parents("div.views-row").addClass("active");
.active {
background: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="views-row views-row-10 views-row-even views-row-last">
<div class="sonuc">
<span>text1</span>
</div>
</div>
<div class="views-row views-row-11 views-row-even views-row-last">
<div class="sonuc">
<span>text2</span>
</div>
<div class="views-row views-row-11 views-row-even views-row-last">
<div class="sonuc">
<span>text11</span>
</div>
Вы можете найти правильный элемент в одном фильтре:
$(".sonuc:contains('text1')").parent().addClass('hobi');
Или, если вы действительно имеете в виду первого родителя, просто используйте :eq()
:
$(".sonuc:eq(0)").parent().addClass('hobi');
Вы пытаетесь найти родителя sonuc
, но добавьте класс только к sonuc
if ($(".sonuc").has(":contains('text1')").length) {
$('.sonuc').addClass('hobi')
}
Просто добавьте first()
в свой jquery
if ($(".sonuc").has(":contains('text1')").length) {
$('.sonuc').first().parent().addClass('hobi')
}
.hobi{
color:red;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="views-row views-row-10 views-row-even views-row-last">
<div class="sonuc">
<span>text1</span>
</div>
</div>
<div class="views-row views-row-11 views-row-even views-row-last">
<div class="sonuc">
<span>text2</span>
</div>
Просто объедините все, что у вас уже есть.
$('.sonuc').has(":contains('text1')").parent().addClass('hobi');
может быть, это не очень хорошая идея, чтобы протестировать текст, это может измениться...
чтобы получить первый элемент набора элементов, который вы можете:
$('.sonuc').eq(0).parent().addClass('hobi');
или
$('.sonuc:eq(0)').parent().addClass('hobi');
Более простой прямой путь без использования :contains
, .filter()
есть,
$('.sonuc > span:first').parent().addClass('hobi');
Он выбирает первый прямой потомок потомка под классом .sonuc
, а затем с помощью .parent()
выбирает его родительский и добавляет в него класс .hobi.
$('.sonuc > span:first').parent().addClass('hobi');
.hobi {
background: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div class="views-row views-row-10 views-row-even views-row-last">
<div class="sonuc"> <span>text1</span>
</div>
</div>
<div class="views-row views-row-11 views-row-even views-row-last">
<div class="sonuc"> <span>text2</span>
</div>
</div>