Question

这是我的example。

$(function() {
    $('li > ul').each(function() {
        var parent_li = $(this).parent('li');
        var sub_ul = $(this).remove();
        parent_li.click(function() {
            sub_ul.toggle();
        });
        parent_li.append(sub_ul);
    });
    $('ul ul').hide();
});

如果要打开第三个节点，您会发现问题。因为它在每次点击时切换所有内容，所以我尝试过使用检查是否有父母只隐藏孩子等，但是它根本不起作用......

欢迎提出任何建议。

Answer 1

这应该有效：

$(window).load(function() {
    $('li').click(function(evt) {                   
        $(this).children('ul').toggle();
        evt.stopPropagation(); //Stop bubbling upwards, so our parent doesnt recieve this click!
    });
});

每当您点击LI时，您想要切换孩子。问题是事件冒泡，您的点击是在最内层元素上触发，但随后冒泡到父级。正如预期的那样关闭元素。

这就是为什么我们在它到达之前停止冒泡，所以父母不会得到点击而我们保持开放。

简单的jQuery树有更多节点的麻烦

1 个答案: