在 Jasny Bootstrap 中单击链接时关闭画布侧边栏答案

【问题标题】：Close off-canvas sidebar on link click in Jasny Bootstrap在 Jasny Bootstrap 中单击链接时关闭画布侧边栏
【发布时间】：2017-04-20 09:32:22
【问题描述】：

我正在开发一个网站http://maypoprestaurant.com/location

在移动设备上 (

当我在这里拉头发时，任何帮助都将不胜感激。 :x

// 导航代码

// Navigation Code    
<div id="navA" class="navmenu navmenu-default navmenu-fixed-left offcanvas-xs">
  <a class="navmenu-brand visible-sm visible-md visible-lg" href="#"><img src="<?php echo get_stylesheet_directory_uri(); ?>/img/maypop-logo.png" class="logoSidebar"></a>
  <ul class="nav navmenu-nav">
    <li><a data-toggle="offcanvas" data-target=".navmenu" href="/home2" class="<?php if (is_page('home2')) echo 'active'; ?>">
    <i class="fa fa-home" aria-hidden="true"></i> Home</a></li>

    <li><a data-toggle="offcanvas" data-target=".navmenu" href="/menus" class="<?php if (is_page('menus')) echo 'active'; ?>">
    <i class="fa fa-plus" aria-hidden="true"></i> Menus</a></li>

    <li><a data-toggle="offcanvas" data-target=".navmenu" href="/location" class="<?php if (is_page('location')) echo 'active'; ?>">
    <i class="fa fa-map-marker" aria-hidden="true"></i> Location</a></li>

    <li><a data-toggle="offcanvas" data-target=".navmenu" href="/press" class="<?php if (is_page('press')) echo 'active'; ?>">
    <i class="fa fa-newspaper-o" aria-hidden="true"></i> Press</a></li>

    <li><a data-toggle="offcanvas" data-target=".navmenu" href="/events" class="<?php if (is_page('events')) echo 'active'; ?>">
    <i class="fa fa-calendar-o" aria-hidden="true"></i> Events</a></li> 
  </ul>
</div>

我在标题中添加了这个 Javascript：

<script type="text/javascript">
jQuery("#navA .navmenu-nav a").click(function(){
jQuery('.navmenu').offcanvas('hide');
});
</script>

** 更新/编辑**

我已成功使用此代码使移动侧边栏在点击时隐藏：

<script type="text/javascript">
jQuery(".navmenu .nav li a").on("click", function (){
jQuery("#navA").removeClass("in canvas-slid");
});
</script>

现在的问题是汉堡包图标不知道我已经这样做了，因此需要点击 2 次才能打开菜单，而不仅仅是一次。我需要以某种方式告诉该事件重置。

有什么想法吗？

【问题讨论】：

标签： jquery twitter-bootstrap jasny-bootstrap

【解决方案1】：

我不确定这是最有效的方法，但你可以试试这个：

<script type="text/javascript">
jQuery("#navA .navmenu-nav a").click(function(e){
e.preventDefault();
jQuery('.navmenu').offcanvas('hide');
$(location).attr('href', $(this).attr(href));
});
</script>

【讨论】：

不幸的是，这对我不起作用，甚至用 jQuery 为 Wordpress 切换 $。