Подтвердить что ты не робот

Как использовать jquery next() для выбора следующего div по классу

Я новичок в jquery и борюсь с чем-то, что должно быть довольно простым. Я хочу выбрать предыдущий и следующий div с классом "MenuItem" из div с классом "MenuItemSelected".

HTML

<div id="MenuContainer" class="MenuContainer">
    <div id="MainMenu" class="MainMenu">
        <div class="MenuItem">
            <div class="MenuItemText">Menu Item #1</div>
            <div class="MenuItemImage">images/test1.jpg</div>
        </div>    
        <div class="MenuDividerContainer">
            <div class="MenuDivider"></div>
        </div>
        <div class="MenuItem MenuItemSelected">
            <div class="MenuItemText">Menu Item #2</div>
            <div class="MenuItemImage">images/test2.jpg</div>
        </div>
        <div class="MenuDividerContainer">
            <div class="MenuDivider"></div>
        </div>
        <div class="MenuItem">
            <div class="MenuItemText">Menu Item #3</div>
            <div class="MenuItemImage">images/test3.jpg</div>
        </div>
    </div><!--/ .MainMenu -->
</div><!--/ .MenuContainer -->

Вот следующий jquery, который, как я думал, должен был работать.

$('div.MenuItemSelected').next('.MenuItem');

Я также пробовал

$('div.MenuItemSelected').nextAll('.MenuItem');

Единственное, что я могу сделать, это

$('div.MenuItemSelected').next().next();

Это кажется хоки, любые идеи?

4b9b3361

Ответ 1

Вы пробовали:

$('div.MenuItemSelected').nextAll('.MenuItem:first');

Я думаю, что проблема, с которой вы сталкиваетесь, заключается в том, что next возвращает самого следующего брата, тогда как nextAll возвращает коллекцию всех последующих братьев и сестер, соответствующих вашему селектору. Применение селектора :first к вашему фильтру nextAll должно сделать все правильно.

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

$('div.MenuItemSelected').next().next();