найти на странице соседних братьев и сестер jquery?

хорошо, я искал ответ на этот вопрос (если он вообще есть) без везения

у меня есть последовательность элементов div, как показано на рисунке ниже:

http://i61.photobucket.com/albums/h46/DrAcOliCh_2006/untitled-1.jpg?t=1300520458

синий фон является абсолютным родителем оранжевых элементов div, которые также являются братьями и сестрами.

DOM не совсем организован в соответствии с тем, как оранжевые элементы отображаются на странице, потому что все они перетаскиваются (я использовал jquery UI), и я перемещал их внутри родителя, но, как известно, DOM не реорганизуется, когда я перемещаю перетаскиваемые элементы, так что в основном структура братьев и сестер остается неизменной внутри DOM

что мне нужно (опять же, если это вообще возможно), так это определить ближайших на странице соседних братьев и сестер друг друга; другими словами, скажем, мы берем этот элемент «FlashBanner», который на странице имеет элементы «Лого», «Поиск» и «Корзина покупок» в качестве непосредственных верхних братьев и сестер, а элементы «Категории» и «Контент» — в качестве непосредственных нижних. братья и сестры (и нет левых или правых братьев и сестер)

у меня есть ручное решение для этого, то есть предварительно указать соседние элементы на странице для каждого элемента через ряд полей формы и прочее (еще одна история и еще одна стена текста для объяснения), но это не важно, поскольку я хотите знать, можно ли это сделать автоматически (например, скажите jquery, чтобы найти их для меня)

ценим любую помощь, даже "это не может быть сделано автоматически", и спасибо за ваше время

надеюсь, это не звучит двусмысленно (или глупо, если на то пошло) и почему мне нужно это сделать, не спрашивайте: P стена текста, чтобы объяснить

ваше здоровье :)


person Stefan    schedule 19.03.2011    source источник


Ответы (1)


Просто хотел уточнить для вас, что DOM на самом деле изменяется, когда вы перемещаете что-то с помощью draggable-ui.

Так что это может помочь вам найти то, что вы ищете.

Вы можете сделать что-то вроде:

$('#flashbanner').prev()  // For previous siblings

Или перебрать все div.

$(#blue).find('div').each(function(){
  $(this).blahblah  // current div
});

Или даже перебирать все предыдущие братья и сестры, искать высоты и т. Д. Но это должно быть последним средством...

$('#flasshbanner').prevAll().each(function(){
  var height = $(this).height();
  if(height == blahblah){
    //do stuff
  }
});

Но ключом является DOM, он смещается, когда вы перемещаете что-то, поэтому, если вы знаете, что происходит, вы можете найти его «автоматически» с помощью jQuery. Плагин FireBug для Firefox должен помочь вам взглянуть на новый DOM, когда вы его перемещаете. (Я считаю, что большинство веб-разработчиков используют FireFox при разработке из-за чистого блеска FireBug, кстати)

Вы можете попробовать загрузить свой код на http://jsfiddle.net/, чтобы мы могли помочь вам с актуальными исходными кодами. :)

Удачи друг.

person Quang Van    schedule 21.03.2011
comment
скорее всего, использую firefox, хотя я использую Opera, а также Opera Dragonfly для разработки, если это имеет какое-то значение... я проверил вашу теорию и визуализировал DOM до и после перемещения элементов, а в Dragonfly DOM не работает. кажется, реорганизует себя... draggable-ui меняет верхнюю и левую позиции для перетаскиваемого элемента, а также добавляет position:absolute и некоторые другие свойства CSS к соответствующему элементу, но, похоже, это вообще не изменяет DOM: -/ я попробую установить firefox и использовать firebug для лулзов :P я могу что-то упустить :-/ - person Stefan; 21.03.2011
comment
Opera Dragonfly кажется крутой, я не хотел обобщать FireBug, но воспринимаю это как свидетельство того, насколько классным я считаю FireBug. :) - person Quang Van; 08.04.2011