javascript - 为什么 jQuery 对我的所有列表元素应用点击阻止

Question

我正在构建一个多级下拉列表

HTML

<div id="sidebar" class="sidebar-left">
    <ul class="downlod-categories">
        <li class="cat-item cat-item-31">
            <a title="Kategória 1 kategória összes bejegyzése" href="?dlm_download_category=kategoria-1">Kategória 1</a>
            <ul class="children" style="display: block;">
                <li class="cat-item cat-item-32">
                <li class="cat-item cat-item-35">
                <li class="cat-item cat-item-36">
                    <a title="Alkategoria 3 kategória összes bejegyzése" href="?dlm_download_category=alkategoria-3">Alkategoria 3</a>
                </li>
            </ul>
        </ul>   
    </li>

jQuery

$('#sidebar ul.downlod-categories li').each(function(){
    var child = $(this).children('ul.children');

    if(child.length)
    {
        $(this).on('click', function(e){
            e.preventDefault();
            child.show();
        });
    }
});

我的问题是，如果实际的 li 有子元素，则阻止默认值有效，但它也适用于所有子元素。

可以请有人给我提示，或者指出我做错了什么吗？

Answer 1

像这样更改你的选择器 -

$('#sidebar ul.downlod-categories > li')