wordpress wp_nav_menu：如何用对应于元素标题的 id 包装菜单的每个元素？答案

【问题标题】：wordpress wp_nav_menu : how to wrap each element of the menu with an id corresponding to the element title?wordpress wp_nav_menu：如何用对应于元素标题的 id 包装菜单的每个元素？
【发布时间】：2013-08-01 16:59:29
【问题描述】：

我想根据单击或鼠标悬停的菜单元素显示图像。

为菜单的每个元素设置不同的 id 以便使用 JQuery 处理 li 元素。

如何用与其标题对应的 id 来包装菜单的每个元素？有什么替代方法可以让这个工作吗？

到目前为止，我的函数调用是这样的：

if ( function_exists('has_nav_menu') && has_nav_menu('red sea') )
  {
    wp_nav_menu( array( 
       'depth' => 4,
      'sort_column' => 'menu_order', 
       'container' => 'ul', 
       'menu_id' => 'nav', 
        'menu_class' => 'fr',
        'theme_location' => 'pages mer rouge',
        'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>' ) );
    }

我不知道 %1$s 或 %2$s 是什么意思？

【问题讨论】：

%1$s 将被 wp_nav_menu 中的 id 替换，%2$s 与 class 和 %3$s 与 li 元素也是如此。

标签： jquery wordpress menu

【解决方案1】：

Wordpress 已经在您的菜单中添加了 ID。只需在浏览器中查看您网站的代码......它看起来像这样：

<li id="menu-item-17" ...>Title1</li>
<li id="menu-item-18" ...>Title2</li>
<li id="menu-item-19" ...>Title3</li>
<li id="menu-item-20" ...>Title4</li>

您可以使用这些 ID 为每个列表项添加不同的行为；）

【讨论】：

当然 ..我希望有一个更明显的名称以便更好的可维护性...我想用我在后台给这个元素的名称替换 menu-item-17

【解决方案2】：

每个 Wordpress 页面都有一个唯一的 ID。右键单击并检查您网站上的元素以查看它的 id，或者转到您的 wordpress 页面，您应该在那里找到 page-item-id。这被分配为 wp-nav-menu 中每个列表项的 id。这几乎是为每个项目设置样式的唯一好方法。或者，如果您的菜单不会改变，您也可以尝试使用 nth-child... 希望对您有所帮助。

【讨论】：