單擊鏈接時關閉畫布外移動菜單（JS）

Question

我有一個移動菜單，其中包含一些錨定的鏈接，單擊這些鏈接可以滾動到頁面的特定部分。 問題是當我單擊這些鏈接之一時，由於未加載新頁面，菜單保持打開狀態。

我希望實現一種解決方案，如果單擊這些鏈接之一，則默認情況下將關閉菜單。 我試圖使用JS隱藏單擊菜單，但我認為我的邏輯可能是錯誤的。 任何幫助都會很棒。

這是我菜單的代碼。

<div id="my-id" class="uk-offcanvas custom_canvas">
   <div class="uk-offcanvas-bar">
      <div class="uk-panel">
         <a class="btn btn primary remove_image-div" onclick="UIkit.offcanvas.hide([force = false]);"> 
            <img src="img/remove_icon.png" class="remove_image" alt="remove">
         </a>
         <ul class="mm-list mm-panel mm-opened mm-subopened" id="mm-0">
            <li class="offcanvas_li">
               <a class="offcanvas_open" title="Samples" href="index.html#sample-section">Samples</a>
            </li>
            <li class="offcanvas_li">
               <a href="index.html#package-section" title="Packages" class="offcanvas_open">Packages</a>
            </li>
            <li class="offcanvas_li">
               <a href="#about-section" title="About" class="offcanvas_open">About</a>
            </li>
            <li class="offcanvas_li">
               <a href="contact.html" title="Contact" class="offcanvas_open">Contact</a>
            </li>
            <li class="offcanvas_li">
               <a href="blog.html" title="Blog" class="offcanvas_open">Blog</a>
            </li>
            <li class="offcanvas_li">
               <a class="offcanvas_open" title="We Love" href="we_love.html">We Love</a>
           </li> 
        </ul>
     </div>
  </div>
</div>

Answer 1

我對UIkit.offcanvas插件不熟悉， UIkit.offcanvas某種意義上講，我可以回答你可以將它們的所有屬性（鏈接）添加到onclick="UIkit.offcanvas.hide([force = false]);"

更好的 （通用）解決方案是“監聽”其click事件，然后運行offcanvas命令。

就像是：

$('.offcanvas_li a').click(function() {
   UIkit.offcanvas.hide([force = false]);
});

Answer 2

這有效

    <script>
  function myFunction() {
  UIkit.offcanvas.hide([force = false])
  }</script>
<button onclick="myFunction()">Close Panel</button>