希望将不同的类应用于每个选定的菜单元素 - Want to apply different classes to each selected menu elements

Want to apply different classes to each selected menu elements

本文关键字：元素菜单应用于希望 | 更新日期: 2023-09-27

嗨，我在自定义wordpress菜单主题时遇到问题。我想在每个选定的菜单上应用不同的类。

这正是我想要的。

<ul>
<li class="item1">Home Page</li>
<li class="item2">About Page</li>
<li class="item3">Contact Page</li>
</ul>

单击菜单项时，将在每个选定的菜单项上应用不同的类例如，我想单击菜单项1，类active1应该添加到选定的

元素中，类似于如果我单击项2，类active2应该添加到所选的<li〉元素中>

这就是我试图实现这一点的方式，但它不起作用

    add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);
    function special_nav_class($classes, $item){
     if ($item == 'Home Page') {        
if( in_array('current-menu-item', $classes) ){
                    $classes[] = 'active1';
                }
    }
if ($item == 'Home Page') {         
if( in_array('current-menu-item', $classes) ){
                    $classes[] = 'active2';
                }
    }
         return $classes;
    }

有人能帮我吗？提前感谢

这需要一些jQuery

PHP

首先，让我们构建菜单：

$menu = array(
    '1' => 'Home',
    '2' => 'About',
    '3' => 'contact',
);

PHP/HTML

<ul class="menu">
<?php foreach ($menu as $id => $item): ?>
    <li><a class="item item-<?= $id; ?>" href="#"><?= $item; ?></a></li>
<?php endforeach; ?>

jQuery

$(document).ready(function() {
    $(document).on('click', '.item', function () {
            $('.item').removeClass('active');
            $(this).addClass('active');
    });
});

仔细阅读后，我发现您想在PHP中添加该类。为了回答您的问题，我需要了解$classes数组的外观