Jquery切换多个不起作用的嵌套列表项
Jquery切换多个不起作用的嵌套列表项
提问于 2019-01-25 19:04:10
我有一个无序列表，其中有一个jQuery预置切换按钮(..menu展开)。单击此按钮时，请切换一个类以打开子菜单。
问题是，类被添加到所有的子菜单中，所以当单击第一个切换按钮时，它们都会打开。
我不能更改HTML结构，因此需要在jQuery中使用预置切换按钮独立切换每个子菜单的解决方案。有谁能帮忙吗？
我尝试过使用.next()，但是我无法让它工作。
这是HTML
<ul>
<li class="has-dropdown">
Item
<ul class="dropdown">
<a href="#">Sub Item 1</a>
<li class="has-dropdown">
<a href="#">Sub Item 2</a>
<ul class="dropdown">
<a href="#">Sub Item 3</a>
<li class="has-dropdown">
<a href="#">Sub Item 4</a>
<ul class="dropdown">
<a href="#">Sub Item 5</a>
</ul>
</li>
</ul>
</li>
</ul>
</li>
下面是jQuery：
jQuery('.has-dropdown').prepend('<a class="menu-expand">+</a>');
$(".menu-expand").on("click", function(e) {
e.stopPropagation();
jQuery(this).closest('.has-dropdown').find('ul.dropdown').toggleClass('active');
})CSS：
ul.dropdown{
display:none;
}
ul.dropdown.active {
display:block;
}回答 1
Stack Overflow用户
回答已采纳
发布于 2019-01-25 20:19:40
Salam，您可以使用子函数()函数而不是find()，
jQuery('.has-dropdown').prepend('<a class="menu-expand">+</a>');
$(".menu-expand").on("click", function(e) {
e.stopPropagation();
jQuery(this).closest('.has-dropdown').children('ul.dropdown').toggleClass('active');
})
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54371403
复制相关文章
相似问题
腾讯云开发者
