Использование & # 8220; this & # 8221; с помощью селекторов jQuery
-
05-07-2019 - |
Вопрос
У меня есть некоторый HTML, который выглядит следующим образом:
<ul class="faq">
<li class="open">
<a class="question" href="">This is my question?</a>
<p>Of course you can, it will be awesome. </p>
</li>
</ul>
Используя CSS, я устанавливаю тег 'p' для отображения: нет ;. Я хочу использовать jQuery для отображения или скрытия тега 'p' при нажатии на ссылку, но у меня возникли некоторые проблемы с селектором родного брата. Р>
Просто пытаясь заставить селектор работать, я попытался:
$("a.question").click(function () {
$(this + " ~ p").css("background-color", "red");
});
чтобы проверить это. Похоже, что селектор братьев и сестер не может быть использован таким образом, и, поскольку я совершенно новичок в jQuery, я не знаю подходящих средств для этого. Р>
Заранее спасибо!
Решение
Попробуйте использовать:
$(this).siblings('p').css()
Другие советы
$(this).next("p").css("...")
the " p " Выше необязательно, если вы просто хотите следующий узел без пробелов в DOM.
Я хочу использовать jQuery для отображения или скрытия тега 'p' при щелчке на якоре
Поскольку вы упомянули, что вы хотите переключать тег 'p' при щелчке якоря, я сделаю следующее:
$("a.question").click(function (event) {
$(this).siblings('p').show(); //toggle the p tags that are siblings to the clicked element
event.preventDefault(); //stop the browser from following the link
});