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')

Answer 2

感谢您的所有回复，这有效

而不是

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

我必须使用

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

为什么jQuery将click prevent应用于我的所有列表元素

2 个答案: