移动菜单中的jQueryUI标签

Question

我使用的是jQueryUITabs，并将其转换为手机菜单。我一直试图关闭移动菜单，但没有成功，当我点击一个标签，我已经尝试添加一个新的类到菜单，以显示无和显示块，但它的but，所以我正在寻找一些帮助，我如何关闭标签组，一旦你选择一个标签，并显示其内容。

我设置了一个小提琴- https://jsfiddle.net/ju6q9L4a/30/

我不擅长jquery，所以我主要使用wiget并调用来执行选项卡来工作。

   $( ".jquery-tabs" ).tabs();

我添加了这个来显示和隐藏菜单，但它不是很流畅

$( ".site-navigation li" ).click(function() {
  $('.site-navigation').hide();
});
$( "#nav-toggle" ).click(function() {
  $('.site-navigation').show();
});

Answer 1

我能够通过将数据切换和目标添加到li本身来使其正常工作。

<li data-toggle="collapse" data-target=".navbar-1"><a href='#tab-1'>Tab #1</a></li>
<li data-toggle="collapse" data-target=".navbar-1"><a href='#tab-2'>Tab #2</a></li>

https://jsfiddle.net/ju6q9L4a/41/