prevAll () и фильтр по дочернему присутствию

Question

prevAll () и фильтр по дочернему присутствию

0

У меня есть следующая (искусственная) DOM:

<div class="something">xxx</div>
<div class="something">
  <div class="essence">yyy</div>
</div>
<div class="something">zzz</div>
<div class="something">
  <div class="essence">111</div>
</div>

Затем в $(document).ready я делаю:

$('.essence').click(function()
{
    $(this).parent().prevAll('.something > .essence').toggle();
    $(this).parent().nextAll('.something > .essence').toggle();
});

Кажется, это не работает.

В принципе, я хочу скрыть/показать всех предыдущих и следующих братьев и сестер щелкнутого элемента parent, которые не содержат ребенка с тем же классом, что и элемент с щелчком.

Пожалуйста помоги. Извинения, если это кажется неопределенным

Roman Saveljev 19 окт. 2013, в 21:40

Источник

Теги:

javascript

jquery

4 ответа

0

Ваш код должен быть заменен на:

$('.essence').click(function()
{
    $(this).parent().siblings().not(':has("> div")').toggle();
});

Ashok Kumar Gupta 19 окт. 2013, в 18:31

0

рабочая модель здесь: jsfiddle.net/bmegR/2
Ashok Kumar Gupta 19 окт. 2013, в 20:26

0

Вы можете использовать расширение: has() следующим образом:

$(this).parent().siblings('.something:has(.essence)').toggle();

Это выберет всех братьев и сестер.parent(), которые относятся к классу.something и содержат потомка класса.essence. Вы также можете сделать это, что, согласно документации, может быть быстрее:

$(this).parent().siblings('.something').has('.essence').toggle();

Это странное поведение, когда я вижу это в действии, поэтому трудно понять, действительно ли это именно то, что вам нужно. Если вы хотите переключить всех братьев и сестер, у которых НЕ есть дочерний класс класса.essence, попробуйте следующее:

$(this).parent().siblings('.something').not(':has(.essence)').toggle();

struthersneil 19 окт. 2013, в 17:56

0

Вы можете попробовать это

$('.essence').click(function()
{
    var className = $(this).attr('class');
    $(this).parent().siblings().filter(function(){
        return !$(this).children('.'+className).length;
    }).toggle();
});

DEMO.

The Alpha 19 окт. 2013, в 16:47

0

Я могу попробовать это, если у него нет синтаксической ошибки: lenght . Во всяком случае, в jsfiddle это работает так, что он скрывает также предыдущий. .something с .essence child
Roman Saveljev 19 окт. 2013, в 19:40
0

@RomanSaveljev, мой плохой, исправил опечатку, но спасибо за напоминание :-)
The Alpha 19 окт. 2013, в 19:43
0

@RomanSaveljev, извините за неправильное тестирование кода, но теперь он работает :-)
The Alpha 19 окт. 2013, в 19:45

Показать ещё 1 комментарий

Ещё вопросы

рабочая модель здесь: jsfiddle.net/bmegR/2
Я могу попробовать это, если у него нет синтаксической ошибки: lenght . Во всяком случае, в jsfiddle это работает так, что он скрывает также предыдущий. .something с .essence child
@RomanSaveljev, мой плохой, исправил опечатку, но спасибо за напоминание :-)
@RomanSaveljev, извините за неправильное тестирование кода, но теперь он работает :-)

Felix Kling · Accepted Answer · 2013-10-19T18-09-00.000Z

Я выделил важные части вашего требования:

Я хочу скрыть всех предшествующих и следующих братьев и сестер щелкнутого элемента parent, которые не содержат дочерний элемент с тем же классом, что и элемент с щелчком.

который будет

$(this).parent().siblings().not(':has(> .' + this.className + ')').hide();

или

var className = this.className;
$(this).parent().siblings().filter(function() {
    return $(this).children('.' + className).length === 0;
}).hide();

Объяснение, почему ваш код не работает:

.prevAll и .nextAll получите предыдущее для следующих братьев и сестер элемента, если и только если они соответствуют селектору. В вашем случае все братья и сестры имеют something классное. Селектор не соответствует ни одному из них, потому что это соответствует только элементы с классом essence, которые являются потомками элементов с классом something - something.
Я понимаю, что вы пытались сделать, но не так, как эти методы работают.

Круто, это работает! Мне нужно было только изменить hide() для toggle как я хочу переключать видимость