javascript - 选择 href 为 ="#"的标签并打开父 li

标签 javascript jquery css

我有navgoco安装在我正在开发的网站上。我是 jQuery 的新手。 Navgoco 在侧边菜单的无序列表上创建了一些切换开关,效果非常好。

问题来了。 Navgoco 将每个父项都变成一个切换项。因此,即使切换具有散列 (#) 以外的链接并且不可能用作切换,它仍会关闭其子项。

我很好奇是否可以从子项中解开父项。像这样的东西(除了这对我不起作用)。这会检测到哪儿也去不了的网址(带有散列的网址)并打开父 li 的包装,这样它就不会变成切换菜单。

$("ul > li > a[href='#']").parent().unwrap();

此外,我很乐意将链接和切换按钮分开。所以 a 标签可以转到页面链接,但切换到其他地方。像这样:

[icon] 菜单项

其中 :before(图标)将是打开菜单项下方列表的切换链接,而菜单项本身可以链接到页面。

看看他们如何处理页面左侧的菜单? http://sevenspark.com/docs/shiftnav-setup

也许我需要 navgoco 以外的解决方案。有什么想法吗?

最佳答案

为此,您可以使用 jQuery UI Accordion 和一些 $ jquery 用法。如果需要,这还可以帮助您在标题上添加更多工具图标/按钮以实现其他功能。如果有兴趣,这是您想要的示例:

http://codepen.io/Nasir_T/pen/mAgmJR

您还可以做更多的事情来自定义它的行为和设计。

https://jqueryui.com/accordion/

希望这对您有所帮助。

关于javascript - 选择 href 为 ="#"的标签并打开父 li,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40262378/

相关文章:

javascript - 无法从我的数组中删除偶数

javascript - 强制将页面大小调整为特定大小

jquery - 未捕获的类型错误 : undefined is not a function in Joomla! 模板

css - 如何为 Angular 中的多个元素添加动态样式

html - 在标题菜单中链接自定义 HTML 页面

css - 最新的 Chrome 更新搞砸了 Sencha Touch 2.0.0 布局

javascript - 为什么 clearInterval 不适用于函数

javascript - Facebox 插件 onClick 做某事

javascript - 从 jQuery ajax 获取数据

javascript - Jquery 时间选择器 : How to dynamically change parameters