jquery - Javascript 事件委托

Question

我试图为事件委托重写以下函数：

$("ul > li.closed").click(function (e) {
    if (e.target === this) {
        var li = $(this).closest('li');
        li.find(' > ul').slideToggle('fast');
        $(this).toggleClass("closed open");
    }
});

我重写的所有其他函数都运行良好，但这个没有。这是我写的：

$(document).on("click", "ul > li.closed", function (e) {
    if (e.target === this) {
        var li = $(this).closest('li');
        li.find(' > ul').slideToggle('fast');
        $(this).toggleClass("closed open");
    }
});

正如你所看到的，我并没有真正改变太多。ul 打开，但不再关闭。我的错误在哪里？

Answer 1

问题是一旦li打开，类closed被删除并被open添加，这意味着选择器li.closed不匹配

在事件委托的情况下，选择器被懒惰地评估，但在正常事件处理的情况下，处理程序在事件注册时注册到目标元素，因此在那个时候任何元素都有该类closed将获得处理程序

$(document).on("click", "ul > li:has(ul)", function (e) {
    var li = $(this).toggleClass("closed open");
    li.children('ul').slideToggle('fast');
});