如何使用JavaScript - Yii2菜單

Question

我創建的菜單爲我的警予1應用程序通過使用下面的代碼：

<nav class="navigation"> 
       <ul class="navigationList" id="myTopnav"> 
        <li class="expanded navigationList-item"> 
        <a href="#section803" class="navigationList-link">Наши контакты</a> 
       </li> 
        <li class="first expanded navigationList-item"> 
         <a href="#section804" class="navigationList-link">О компании</a> 
        </li> 
        <li class="expanded navigationList-item"> 
         <a href="#section805" class="navigationList-link">О членство ТПП</a> 
        </li> 

        <li class="expanded navigationList-item"> 
        <a href="#section806" class="navigationList-link">моe цели</a></li> 
        <li class="last leaf navigationList-item--border navigationList-item"> 
         <a href="https://www.chamber.com/contact" class="navigationList-link">Личины кабинет</a> 
        </li> 

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
         <a href="javascript:void(0);" style="font-size:15px;" onclick="myMenu()" class="click">&#9776;</a> 
         <ul class="nav" id="nav_bar"> 
          <li><a href="#section803">Наши контакты</a></li> 
          <li><a href="#section804">О компании</a></li> 
          <li><a href="#section805">О членство ТПП</a></li> 
          <li><a href="#section806">моe цели</a></li> 
          <li><a href="#">Личины кабинет</a></li> 

         </ul> 
        </div> 
       </ul> 

      </nav> 
      <script src="<?php echo Yii::app()->theme->baseUrl; ?>../../Index/script_nav.js"></script> 

一切正常（圖）。 yii 1 version

但是，當我開發yii2應用程序，它沒有工作。更確切地說，手機版的菜單元素也出現了。 yii2 version 我用registerJsFile registred它並插入下面的內AppAsset代碼：

public $jsOptions = ['position' => \yii\web\View::POS_BEGIN]; 

如何解決在Web應用程序的Web版本出現移動和網頁版的菜單項的錯誤。 （從網絡版刪除手機版菜單鏈接）。

Answer 1

在我的Yii 2項目中，我通常使用移動檢測庫https://github.com/serbanghita/Mobile-Detect/。 在您的項目中很容易實現（例如https://github.com/alexandernst/yii2-device-detect/庫）。在您的代碼中，您可以添加類似下面的內容：

   ... 
       <li class="expanded navigationList-item"> 
       <a href="#section806" class="navigationList-link">моe цели</a></li> 
       <li class="last leaf navigationList-item--border navigationList-item"> 
        <a href="https://www.chamber.com/contact" class="navigationList-link">Личины кабинет</a> 
       </li> 

       <? if(isMobile()) ?> 

       <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
        <a href="javascript:void(0);" style="font-size:15px;" onclick="myMenu()" class="click">&#9776;</a> 
        <ul class="nav" id="nav_bar"> 
         <li><a href="#section803">Наши контакты</a></li> 
         <li><a href="#section804">О компании</a></li> 
         <li><a href="#section805">О членство ТПП</a></li> 
         <li><a href="#section806">моe цели</a></li> 
         <li><a href="#">Личины кабинет</a></li> 

        </ul> 
       </div> 
       <? endif;?> 
      </ul> 
      ...