Question

不确定我缺少什么。这是我的HTML：

    <ul class="top-level">
        <li class="agency"><a href="contentAgency.php?id=6" class="test">Client</a>
        <ul class="agency-sub">
            <li><a href="">Targeting this</a></li>
            <li><a href=""><Multiple entries</a></li>
        </ul>
        </li>
    </ul>

这是我的功能：

$("ul.top-level").on("click", "ul.top-level li.agency a.test", function (event) {
    var numbs = $(this).attr("href").match(/id=([0-9]+)/)[1];
    $("#content-display article").hide();
    $(this).children().find("a").addClass("sub-active");
    $(this).parent().siblings().find("ul").hide();
    showContentAgency(numbs, this);
    event.preventDefault();
});

点击时，我尝试将类sub-active添加到嵌套的ul li a标记。

Answer 1

而不是$(this).children()使用$(this).next()，因为您要查找的ul元素是被点击的a.test元素的兄弟。

试试这个。

$("ul.top-level").on("click", "li.agency a.test", function (event) {
    var numbs = $(this).attr("href").match(/id=([0-9]+)/)[1];
    $("#content-display article").hide();
    $(this).next().find("a").addClass("sub-active");
    $(this).parent().siblings().find("ul").hide();
    showContentAgency(numbs, this);
    event.preventDefault();
});

Answer 2

this引用a.test元素..

所以你可能需要改变

$(this).children().find("a").addClass("sub-active");

到

$(this).addClass("sub-active");

引用documentation of .on()

提供选择器时，事件处理程序称为委托。 当事件直接发生在绑定元素上时，不会调用处理程序，但仅适用于与选择器匹配的后代（内部元素）。 jQuery将事件从事件目标起泡到附加处理程序的元素（即最里面到最外层的元素），并为该路径上与选择器匹配的任何元素运行处理程序。

Answer 3

$("ul.top-level").on("click", "ul.top-level li.agency a.test"将选择包含“客户”文字的链接，该文字变为$(this)。

$(this).children()没有上下文，因为该链接没有子级。您可能想要：$(this).parent().next().children()

$(this).parent().siblings().find("ul").hide();将选择“代理”的兄弟姐妹，没有，为查找（'ul'）。孩子也不会工作。

找不到UL的子元素

3 个答案: