2013-04-30 2 views
3

В jquery я пытаюсь найти способ поиска в dom до тех пор, пока не найдет селектор. Например.Поиск по DOM из заданного элемента с использованием jquery

Предоставлена ​​эта структура:

<span data-type="contact" data-filter="4" id="buyer-lookup" class="uneditable-input contact-lookup" data-original-title="" title="">Jeff</span> 
<div class="popover"> 
    <div class="arrow"></div> 
    <h3 class="popover-title"><strong>Jeff</strong></h3> 
    <div class="popover-content"> 
     <address style="margin:0;"> MO<br></address> 
     <a data-id="70" data-type="contact" class="pull-right edit-contact" href="#">Edit</a> 
     <div class="clear"></div> 
    </div> 
</div> 

На щелчке «.edit контакта» Я хотел бы искать, пока я не найду „span.contact-поиска“. Я могу использовать родитель пару раз, чтобы получить то, что хочу, как показано ниже, но есть ли более чистый способ, чтобы вы могли просто указать $ (this) .searchUpFunction ('span.contact-lookup'); поэтому он начнет с этого и начнет поиск до тех пор, пока не найдет span.contact-lookup? .prev, похоже, не ищет родителей.

$('.edit-contact').click(function(){ 
     var filter = $(this).parent().parent().prev('span.contact-lookup').data('filter'); 
     alert(filter); 
    }); 
+0

Более быстрый способ, если ваш фрагмент DOM будет '$ (this) .closest ('div.popover'). Prev()' –

+0

Для поиска вверх у вас есть ['.closest()'] (http://api.jquery.com/closest/), но в вашем случае, поскольку вы ищете предыдущий узел предка, в jQuery нет прямой функции ... Тем не менее, вы можете попробовать : '$ (this) .closest (". popover "). prev()'. –

ответ

1

Использование closest

$('.edit-contact').click(function(){ 
    contactID = $(this).closest('div.popover').prev().data('contact-id'); 
    alert(contactID); 
}); 
+1

Нет такой функции '.previous()'. –

+1

Пролет не является частью предков, он предшествует предку div –

+0

@FelixKling Исправлено: – Sharlike

1

Если у вас нет никакой информации о предке, где span.contact-lookup является сестринским, вы можете использовать .parents()[docs] для выбора всех предков:

$(this).parents().prev('span.contact-lookup') 

Это будет менее эффективно, чем использование .closest(), хотя оно будет пересекать дерево до корня.

Кроме того, если есть несколько предков с родным братом span.contact-lookup, вы выберете все из них. В этом случае вы можете получить ближайший с .first() или .last(), в зависимости от того, в каком порядке они выбраны (заказ всегда будет таким же, я просто не знаю его с головы).


Итак: Если вы можете использовать .closest, если нет, то .parents, вероятно, ваш лучший выбор (кроме написания собственного кода для обхода DOM).

Смежные вопросы