铬未捕获的语法错误：意外的标记<

-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

铬未捕获的语法错误：意外的标记<

回答

相关问题