jsf - 如何改变当前选中的菜单项的颜色？

Question

我在 PrimeFaces 中有一个包含许多菜单项的子菜单，我想在它被选中时给它着色，以便向用户显示当前的菜单项。

                <p:submenu label="Books" style="width:60%; color:#FFFFFF; background:#db4455;"
                               icon="ui-icon ui-icon-refresh">
                        <p:menuitem 
                            style="width:95%; font-weight:bold; background:#93c3cd; color:#FFFFFF;"
                            value="Action" url="action.xhtml"  /> 
                        <p:menuitem 
                            style="width:95%; font-weight:bold; background:#93c3cd; color:#FFFFFF;"
                            value="Fiction" url="fiction.xhtml"  /> 
                </p:submenu>

Answer 1

你可以这样做。

JS

$(document).ready(function() {

   $('.ui-menuitem-link').each(function(){
       if(window.location.pathname.indexOf($(this).attr('href')) != -1) {
           $(this).css('background', 'red');//or add class
       }
   });  

})

另见:

• Highlighting selected menu (Another approach)