Целевой соседний элемент в Jquery

0

Я использую код ниже, чтобы изменить знак плюса на минус и наоборот. Это отлично работает, если на странице есть только один элемент.

У меня есть страница с несколькими классами .handler и я ищу, чтобы #plus идентификатор #plus рядом с каждым обработчиком. Есть идеи?

jQuery(".handler").click(function(){
   jQuery("#plus").html(function(_, html) {
        return jQuery.trim(html) == '+' ? '-' : '+';
    });
});

HTML

<div class="term_container">
<div class="handler"><span id="plus"> + </span><?php echo $term->name; ?></div>
<div>
<ul class="list">
<?php

$rp = new WP_Query( $args );
if ($rp->have_posts())
while ( $rp->have_posts() ) { 
$rp->the_post(); 

$name       = get_field('fl_profile_name');
$location   = get_post_meta(get_the_id(), 'fl_country', true);

?>
<li data-location="<?php echo $location; ?>"><a href="<?php the_permalink();?>"><?php echo $name; ?></a></li>

<?php 
}
?>
</ul>
</div>
</div>
  • 1
    поделиться своим HTML, а также
  • 4
    Идентификатор элемента должен быть уникальным, поэтому у вас должно быть не более 1 элемента с идентификатором плюс .... используйте класс для группировки похожих элементов
Теги:

1 ответ

2
Лучший ответ

Сначала измените идентификатор на класс, поскольку у вас есть несколько элементов с одинаковыми свойствами

<div class="handler"><span class="plus"> + </span><?php echo $term->name; ?></div>

затем используйте селектор потомков, чтобы найти элемент plus который находится внутри обработчика щелчка

jQuery(".handler").click(function () {
    var $plus = jQuery(this).find(".plus").html(function (_, html) {
        return jQuery.trim(html) == '+' ? '-' : '+';
    });
    $('.plus').not($plus).html('+')
});
  • 0
    Арун это работает, но есть другая проблема ... Моя страница работает как аккордеон - поэтому, когда пользователь нажимает на другой элемент - знак должен вернуться к + для исходного ... надеюсь, это имеет смысл.
  • 0
    @JoannaMikalai вы можете поделиться сгенерированным html, если возможно создать jsfiddle
Показать ещё 5 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню