Javascript 如何在wordpress中区分顶部导航菜单和主体导航菜单

我目前正在使用wp_nav_menu生成顶部和主体的导航菜单。在header.php中，我使用了

        <?php if(has_nav_menu('body-nav')) {
                wp_nav_menu(array('theme_location' => 'top-nav', 'items_wrap' => '<select class="mobile-menu">%3$s', 'container' => '', 'menu_class' => 'mobile-menu', 'sort_column' => 'menu_order', 'fallback_cb' => 'null'));
} else {
                wp_nav_menu(array('theme_location' => 'top-nav', 'items_wrap' => '<select class="mobile-menu">%3$s</select>', 'container' => '', 'menu_class' => 'mobile-menu', 'sort_column' => 'menu_order', 'fallback_cb' => 'null'));       
} ?>

<?php if(has_nav_menu('top-nav')) {
                wp_nav_menu(array('theme_location' => 'top-nav', 'items_wrap' => '%3$s</select>', 'container' => '', 'menu_class' => 'mobile-menu', 'sort_column' => 'menu_order', 'fallback_cb' => 'null'));
} else {
                wp_nav_menu(array('theme_location' => 'top-nav', 'items_wrap' => '<select class="mobile-menu">%3$s</select>', 'container' => '', 'menu_class' => 'mobile-menu', 'sort_column' => 'menu_order', 'fallback_cb' => 'null'));           
}?>

---

它工作正常，显示良好，但当浏览器Firefox处于还原或小位置时，两个菜单会变成/组合在一个下拉框中。当浏览器处于还原位置时，我需要区分顶部和主体导航菜单。i、 e需要在全屏和浏览器还原/小位置显示顶部菜单栏的顶部菜单以及主体菜单栏的主体菜单。我试了很多。没有解决办法。当我尝试放置下拉框时，它还与顶部菜单和主体菜单相结合。如何区分这类问题。请参阅“恢复向下/小位置”。有人知道这类问题吗？

这类问题是由您的主题引起的。 更具体地说，custom.js位于http://letsassistblog.com/wp-content/themes/thegossip/lib/scripts/custom.js 和媒体查询

第16行

/////////////////////////////////////// Mobile Navigation Menu ///////////////////////////////////////
jQuery("<option />", {"selected": "selected", "value": "", "text": navigationText}).prependTo(".nav select");
jQuery(".nav .menu a").each(function() {
var el = jQuery(this);
var padding = "";
for (var i = 0; i < el.parentsUntil('div > ul').length - 1; i++)
padding += "-";
jQuery("<option />", {
"value" : el.attr("href"),
"text" : padding + el.text()
}).appendTo(".nav select");
});
jQuery(".nav select").change(function() {
window.location = jQuery(this).find("option:selected").val();
}); 

正在使用.nav中的所有.menu类a元素，并转到一个选项select

由于您的身体导航和顶部导航id共享相同的.nav类，因此脚本适用于这两个类

如果您只想影响其中一个，请更改该行中的选择器。 e、 g

或

如果你想完全禁用它，只需删除它或注释掉

关于您对jQuery的评论- 您的站点从3个不同的源和2个版本加载3个不同的库。 jQuery应该只加载一次以避免冲突，除了极端的兼容性问题外，没有理由加载三次

---

它不是多次使用的同一个库-这在jQuery或任何库中都没有意义-这就是库的全部意义

是的，同一个Jquery库被多次使用。对于这种类型的问题，我稍后会看这个作业。但在这一刻，我需要在这个设计中很快在顶部导航菜单以及在移动/响应位置的身体导航菜单。我采取了一个解决方案，使用@media only screen和max width:100px和移动菜单显示内联块以及全屏菜单显示none。但在这里它不是当前的解决方案。它在搜索引擎优化中产生了一个问题。为此，我正在寻找另一种解决方案，如如何在全屏和手机中显示顶部导航菜单以及车身导航菜单。1-我已经向您展示了这一点。。如果您不理解，请阅读我的更新。。2-加载jQuery 3次，使用3个不同版本。这与多次使用的jQuery库不同。这与jQuery使用的是不同的。而且-Jquery只需要加载一次，不管您如何使用它。我不希望只有一个受到影响，我希望两个都受到影响。在custom.js中，我使用jQuerytop nav.menu a.eachfunction编辑了顶部导航菜单，而jQuery2top nav.menu a.eachfunction编辑了主体导航菜单，以显示顶部栏菜单和主体导航菜单。@user2995268-对不起。我相信在你的脑海里，你知道你想要什么——但你的评论和行动对我来说真的不清楚。你能描述一下你想做什么吗？？如果您不希望出现这种行为，请禁用它。好的，我完整地描述一下。现在全屏显示最上面的导航menuHome，大约，。。和身体导航menuHome，社交用品，。。。好好表现一下。当浏览器处于响应位置/恢复位置时，将显示顶部导航菜单和车身导航菜单的菜单选择框/组合框，而不是显示两个菜单的ul li，并且它还将两个菜单栏组合在一个选择框中。但我需要在顶部导航中显示顶部导航菜单，也需要在ul li中的车身中显示车身导航菜单，或在响应位置/浏览器还原位置显示选择框。您了解我需要什么吗。

jQuery(".nav .menu a").each(function()

 jQuery("#top-nav .menu a").each(function() // or body-nav

 jQuery("#top-nav .nav .menu a").each(function()// or body-nav