1

Имеется такая структура:

<ul>
<li></li>
<ul></ul>
<li></li>
<ul></ul>
</ul>

Как написать скрипт jquery для скрытия и раскрытия li>ul Что имею сейчас:

$( document ).ready(function() {    
    $('ul').click(function (event) {
        $(this).children("ul").slideToggle() ;
        event.stopPropagation();
    });
}); 

Он соответственно открывает всех children предыдущего ul.

1
  • 2
    у вас неправильная html структура - в li необходимо влаживать sub ul - jsfiddle.net/hbd37exL
    – soledar10
    9 окт 2015 в 4:50

1 ответ 1

1

у вас неправильная html структура - в li необходимо влаживать sub ul

$(document).ready(function () {
    $('#list > li').click(function (event) {
        $(this).children("ul").slideToggle();
        event.stopPropagation();
    });
});
#list {
}
#list > li {
}
#list > li > ul {
    display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<ul id="list">
    <li>list 1
        <ul>
            <li>sublist</li>
        </ul>
    </li>
    <li>list 2
        <ul>
            <li>sublist</li>
        </ul>
    </li>
</ul>

1
  • Хорошее решение, и даже новичку в данной области более менее понятно что выполняют эти функции jquery. Но я обнаружил баг в использовании этого кода... По неизвестным причинам после нажатия на li действительно открывается children но и скролит страницу в верх до конца, когда закрываешь список так же скролит 1 авг 2017 в 17:34

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.