鉻未捕獲的語法錯誤：意外的標記<

-3

<script> 
    jQuery(document).ready(function($){ 
     if ($(window).width() > 750){ 
      <?php wp_nav_menu(array('theme_location' => 'primary', 'container' => false, 'menu_class' => 'menu clearfix')); ?> 
     }else{ 
      <?php wp_nav_menu(array('theme_location' => 'mobile', 'container' => false, 'menu_class' => 'menu clearfix')); ?> 
     } 
    }); 
</script>

但我通過鍍鉻得到錯誤「未捕獲的SyntaxError：意外的標記<」我指着該行：

我無法找出代碼有什麼問題，任何幫助將不勝感激。

編輯：好吧，不知道在js中運行php有問題。那麼我的情況有什麼合適的解決方案？我知道我只能使用CSS媒體查詢和顯示屬性，但它對性能不利，不是嗎？

來源

2016-01-25 Avishay28

這是因爲您的PHP代碼正在JS腳本塊內生成HTML，語法錯誤。我不確定你試圖達到什麼目的。 –

你想用php代碼實現什麼？ –

我試圖顯示菜單是註冊與'register_nav_menu（）' – Avishay28

您不能簡單地在JavaScript塊內輸出HTML代碼。由於PHP在服務器端運行，因此無法獲取屏幕大小。

有一兩件事你可以做的是輸出兩個菜單的HTML隱入<div>標籤：

<div id='menu_primary' style="display:none"> 
    <?php wp_nav_menu(array('theme_location' => 'primary', 'container' => false, 'menu_class' => 'menu clearfix')); ?> 
</div> 
<div id='menu_mobile' style="display:none"> 
    <?php wp_nav_menu(array('theme_location' => 'mobile', 'container' => false, 'menu_class' => 'menu clearfix')); ?> 
</div>

然後決定何時加載頁面時顯示哪一個：

<script> 
    jQuery(document).ready(function($){ 
     if ($(window).width() > 750){ 
      $('#menu_primary').show(); 
     }else{ 
      $('#menu_mobile').show(); 
     } 
    }); 
</script>

希望這幫助。

（更新。感謝拉菲的提醒。）

原來的解決方案簡單地調整了jQuery調用，使其工作。但是它只能在加載頁面時檢測一次屏幕大小。實現響應的更好方法是使用CSS媒體查詢，當屏幕尺寸發生變化時，它將動態顯示/隱藏不同的菜單版本：

<div id='menu_primary'>Primary</div> 
<div id='menu_mobile'>Mobile</div> 

<!-- CSS media query within a stylesheet --> 
<style> 
@media (max-width: 750px) { 
    #menu_primary { display: none; } 
} 
@media (min-width: 750px) { 
    #menu_mobile { display: none; } 
} 
</style>

來源

2016-01-25 09:42:16 slbteam08

我會隱藏一個或其他使用媒體在CSS中查詢。 – Rafi

鉻未捕獲的語法錯誤：意外的標記<

回答

相關問題