Question

我有一个按钮点击事件触发器的菜单。在客户端，只要菜单可见，我想添加一些样式来触发按钮，当隐藏菜单时，从按钮中删除样式。

为了添加样式，我可以为按钮添加一个监听器并添加样式。但是当隐藏菜单时，我如何向菜单添加一个监听器，以便我可以从按钮中删除该样式？

有没有办法将监听器添加到菜单组件隐藏事件

以下是菜单的代码片段和参考按钮：

<div class="round-button-circle">
                        <p:link id="MenuLink" href="javascript:void(0)"/>
                    </div>
                <p:menu overlay="true" widgetVar="menuWidgetVar" trigger="MenuLink" styleClass="PageHeaderMenu ui-menu-child" >
                    <p:menuitem ...
                </p:menu>

Answer 1

我可以通过覆盖菜单widgetVar实例上的hide函数来实现。不知何故，widgetVar没有在document.ready事件中初始化，因此我不得不懒惰地初始化菜单 -

为按钮添加了一个onclick监听器

<p:link id="MenuLink" href="javascript:void(0)" onclick="showUserMenu();"/>

以下是onclick监听器的代码：

var showUserMenu = function() {
var menuWidget = PF('menuWidgetVar');
if(menuWidget === undefined) {
    return;
}

//lazy initialzed because the PF widgetVar is not visible in document.ready event
if(!menuSettings.initialized) {
    //proxy the method for hide to update styles
    var _hide = menuWidget.hide;
    menuWidget.hide = function() {
        _hide.apply(menuWidget);

        //on hide remove style classes
        $("#MenuLink").removeClass('button-selected');

    };
    menuSettings.initialized = true;
}

//on click add style classes
$("#MenuLink").addClass('button-selected');
};

Primefaces菜单隐藏事件

1 个答案: