JQuery выбрать родительскую проблему

Question

Пример HTML-разметки ниже

<div class="container answer_comments">
<p class="comment_text">Hey that's not cool.</p>
<p class="comment_attribs">By Anonymous User on 01 Dec</p>
<p class="comment_text">Is that really why?</p>
<p class="comment_attribs">By person on 27 Nov</p>
<p class="close_comments" onclick="close_comments()">Close</p>
</div>

JS функция:

function close_comments() {
var comments_wrapper = $(this).closest('.answer_comments');
comments_wrapper.slideUp();
}

.answer_comments не закроется. Это потому, что я использую $ (это) неправильно? Этот div повторяется много раз на странице, как лучше всего добиться того, что я пытаюсь сделать?

Answer 1

Вы правы, что используете this неправильно. Это было бы правильным использованием, если бы вы связывали событие с jQuery:

$('.close_comments').click(function() {
    var comments_wrapper = $(this).closest('.answer_comments');
    comments_wrapper.slideUp();
});

для вашего текущего решения вам нужно будет сделать

function close_comments(obj) {
    var comments_wrapper = $(obj).closest('.answer_comments');
    comments_wrapper.slideUp();
}

и

<p class="close_comments" onclick="close_comments(this);">Close</p>

Answer 2

проверьте, что такое "this", это, вероятно, относится к самой функции, а не к элементу

изменение

<p class="close_comments" onclick="close_comments()">Close</p>

до

<p class="close_comments" onclick="close_comments(this)">Close</p>

и функция до

function close_comments(element) {
  var comments_wrapper = $(element).closest('.answer_comments');
  comments_wrapper.slideUp();
}

и посмотрим, что произойдет