選擇錨點鏈接時強制關閉屏幕切換菜單？

Question

JavaScript的解決方案，我正在尋找應做到以下幾點：

1. 撥動開屏外切換菜單

2. 選擇一個錨標記的菜單鏈接，導航到

   在同一頁上的錨定段

3. 的切換菜單關閉

這是一個完整的代碼Fidd樂演示該問題：https://jsfiddle.net/fpbs6fkz/

注：其它JS + CSS太長張貼在堆棧溢出**

有問題的JavaScript的：

// Find all menu links 
var navLinks = document.querySelectorAll('.c-menu__link'); 
// For each menu link 
var index = 0, length = navLinks.length; 
for (; index < length; index++) { 
    // Attach click event, on click call close function 
    navLinks[index].addEventListener('click', 
     function() { 
      slideLeft.close(); 
     } 
    ); 
} 

以上是JavaScript每當我點擊錨點鏈接並導航到期望部分時，應該關閉切換菜單的功能，但它根本不起作用。

HTML：

<!-- Start of Slidesmenu --> 
<div class="mobilemenu"> 
    <div class="wsmenucontent overlapblackbg"></div> 
    <div class="wsmenuexpandermain slideRight"> 
    <a id="navToggle" class="animated-arrow slideLeft"><span></span></a> 
    <a href="#" class="smallogo"><img src="assets/img/logo4.png" width="120" style= "margin-top:-5px;" alt="" /></a> 

    </div> 

    <nav id="c-menu--slide-left" class="wsmenu slideLeft"> 
    <ul class="mobile-sub wsmenu-list">       
    <li class="c-menu__item"><a href="#about" class="c-menu__link active"><i class="fa fa-home"></i>About</a></li> 
    <li class="c-menu__item"><a href="#contact" class="c-menu__link"><i class="fa fa-road"></i>Contatc</a></li> 
    <li class="c-menu__item"><a href="#fhowitworks" class="c-menu__link"><i class="fa fa-flask"></i>How it Works</a></li> 
    <li class="c-menu__item"><a href="#tools" class="c-menu__link"><i class="fa fa-puzzle-piece"></i>Tools</a></li> 
    <li class="c-menu__item"><a href="#help" class="c-menu__link"><i class="fa fa-wrench"></i>Help</a></li> 
    <li class="c-menu__item"><a href="#customers" class="c-menu__link"><i class="fa fa-server"></i>Customers</a></li> 
    <li class="c-menu__item"><a href="#business" class="c-menu__link"><i class="fa fa-lock"></i>Business</a></li> 
    <li class="c-menu__item"><a href="#location" class="c-menu__link"><i class="fa fa-users"></i>Location</a></li> 
    <li class="c-menu__item"><a href="contact.html" class="c-menu__link"><i class="fa fa-envelope-o"></i>Contact</a></li> 
    </ul> 
    </nav> 
</div> 
<div id="about"><p>About</p></div> 
<div id="contact"><p>Contact</p></div> 
<div id="howitworks"><p>How it Works</p></div> 
<div id="tools"><p>Tools</p></div> 
<div id="help"><p>Help</p></div> 
<div id="customers"><p>Customers</p></div> 
<div id="business"><p>Business</p></div> 
<div id="location"><p>Location</p></div> 

<script>window.jQuery || document.write('<script src="https://code.jquery.com/jquery-1.11.2.min.js"><\/script>')</script> 

所以我的問題是：

如何解決的JavaScript代碼，以便切換菜單關閉，並導航到錨固段當我選擇一個錨菜單鏈接？

Answer 1

儘管代碼和obfusticated的JavaScript可怕的佈局，你可以簡單地替換：

slideLeft.close(); 

與

$("#navToggle").click() 

我通常會告訴你，重用的Click事件處理程序#navToggle，但它隱藏起來了。

$(".c-menu__link").click(function() { $("#navToggle").click() }) 

更新小提琴：

對於更多的「jQuery的」解決方案，以替換整個的JavaScript（你列入問題和不隱藏在小提琴）https://jsfiddle.net/wqd39kL2/1/