Primefaces 右键单击​​ - 支持 bean 方法调用

Question

有没有一种方法可以通过右键单击图像来调用 JSF2/Primefaces 5.x 中的支持 bean ajax 方法？ Primefaces 中有一个 contextMenu 组件，但它会弹出一个我不想要的菜单。

Answer 1

使用 this jQuery 代码和 PrimeFaces <p:remoteCommand> 你可以实现这个，这里是简单的代码：

<h:form>
        <p:graphicImage id="myImage" onmousedown="rmc(event)" library="img" name="myImage.png" class="RMC"/>
        <p:remoteCommand name="rightMouseClick" action="#{backingBean.method}" update="myImage"/>
</h:form>
    <script>
        $(document).on("mousedown", ".RMC", function () {
            $(".RMC").each(function () {
                this.oncontextmenu = function () {
                    return false;
                };
            })

            $(".RMC").mousedown(function (e) {
                if (e.button == 2) {
                    rightMouseClick();
                    return false;
                }
                return true;
            });
        });

        function rmc(e) {
            this.oncontextmenu = function () {
                return false;
            };

            if (e.button == 2) {
                rightMouseClick();
                return false;
            }
            return true;
        }
    </script>

它会在 class RMC 的图像上禁用鼠标右键菜单，并从支持 bean 调用方法。如果您不想禁用菜单，只需删除 .each() 部分。

编辑： 更新 DOM 元素后，它会丢失 $(document).ready() 期间给出的事件，因此您必须直接在组件中添加 onmousedown 事件。

编辑2： 已更改 $(document).ready()，现在即使在更新后也适用于具有 RMC class 的元素。

Answer 2

很简单……分解你的问题。先想想html。您应该简单地通过 jquery 添加右键单击并使用 p:remoteCommand 调用 backingbean