Question

我正在使用Jquery UI“Menu”API在应用程序中创建导航菜单。

菜单绘制和链接很好，当悬停在它上面时，应用了自然的jquery ui css，为悬停元素提供了ui-state-focus类。当您将鼠标移离元素时，它会删除此类，这会将元素置于默认的非突出状态。

我已经尝试添加标准的jquery ui css类“ui-state-active”，它将特定的CSS应用于给定此类的菜单中的元素。但是，当悬停任何其他元素时，这个ui-state-active类将从活动元素中删除，即使尚未进行新选择（通过单击），也会有效地使悬停终止活动选择。

我希望能够保持悬停类的添加，但保持ACTIVE类不变，以便在每个页面上，活动菜单元素将始终具有活动类。

关于在jquery UI菜单api中标记元素的正确方法的任何想法？

Answer 1

我建议为所选项目创建一个单独的类（您可以复制现有的ui-state-active并将其重命名为选中的项目），然后：。

    $("#menu").find("a").click(function(){
    $("#menu").find("a").removeClass("selected");//remove if something was selected
    $(this).addClass("selected");//add a selected class
    });

希望有所帮助

Answer 2

jQuery.widget("ui.menu", jQuery.ui.menu, {
    blur: function( event, fromFocus ) {
        if (event && event.type === "mouseout"))
            return this;
        else 
            return this._super(event, fromFocus);
    } 
});

仅适用于jQuery＆gt; = 1.9

Jquery UI 1.9菜单 - 如何突出显示活动菜单项？

2 个答案: