根据选择的菜单项更改菜单侧边栏 - Semantic UI & JQuery

【问题标题】：Change the menu sidebar based on the menu item selected - Semantic UI & JQuery根据选择的菜单项更改菜单侧边栏 - Semantic UI & JQuery
【发布时间】：2017-11-05 12:52:53
【问题描述】：

我想使用 SemanticUI 根据所选菜单显示不同的侧边栏

我尝试了一种方法，但它似乎不起作用。 Codepen link

在这里，我有 2 个侧边栏菜单项，如果我在菜单“First”内，我需要显示“first_sidebar”，如果我在“Second”内，我需要显示显示“second-sidebar”。

谢谢！

【问题讨论】：

标签： javascript jquery semantic-ui semantic-markup

【解决方案1】：

您正在尝试使用$("div.second_sidebar").hide() 和$("div.first_sidebar").show() 将侧边栏显示为使用jQuery 的普通HTML 元素。

但是，由于侧边栏是您使用 .sidebar() 方法初始化的语义 UI 元素，您应该使用相同的方法来显示和隐藏侧边栏，例如：

$("div.second_sidebar").sidebar('hide');
$("div.first_sidebar").sidebar('show');

参考在这里： https://semantic-ui.com/modules/sidebar.html#/usage

【讨论】：