Почему прыгает многоуровневое меню на jQuery?

Question

[Станислав]

Помогите, пожалуйста, разобраться.
Создал многоуровневое меню-аккордион, но оно работает некорректно (подменю прыгает).
Не могу понять, в чем дело.

<ul class="i01 level_1 accordion">
        <li class="nav_btn"><a>1111111111111</a></li>
        <ul class="i01 level_2">
            <li class="nav_btn"><a>2222222222222</a></li>
            <ul class="i01 level_3">
                <li class="nav_btn"><a>3333333333333333</a></li>
                <ul class="i01 level_4">
                    <li class="nav_btn"><a>4444444444444444</a></li>
                    <li class="nav_btn"><a>4444444444444444</a></li>
                    <li class="nav_btn"><a>4444444444444444</a></li>
                </ul>
            </ul>
        </ul>
    </ul>

$(function() {
    $('.i01.level_1 li').click(function() {
        $(this).next('ul').slideToggle().siblings('ul.level_2').slideUp();
    });
    $('.i01.level_2 li').click(function() {
        $(this).next('ul').slideToggle().siblings('ul.level_3').slideUp();
    });
    $('.i01.level_3 li').click(function() {
        $(this).next('ul').slideToggle().siblings('ul.level_4').slideUp();
    });
});

Answer 1

[v3shin]

$('.i01.level_1 li') уже навешивает обработчик на все вложенные пункты меню. Так что при клике по второму уровню меню срабатывают обработчики $('.i01.level_1 li') и $('.i01.level_2 li') и $(this).next('ul').slideToggle() срабатывает дважды.

Comments

[Станислав]

Благодарю!