标签: jquery-ui-contextmenu

我有多个DOM元素和上下文菜单.当一个元素是另一个元素的子元素并且我调用内部子元素的上下文菜单时,我也会看到父元素的上下文菜单.这是使用jquery-ui.contextmenu插件实现的.

有没有办法配置插件以防止显示父菜单,或者我将不得不手动处理所有点击事件并过滤它们,所以我只显示我想要的菜单？

以下是我的代码:

HTML:

    <!-- Add a child which will have a context menu -->
    <div class="outer-child" id="outer-child">
        Outer Child

        <!-- inner child with its own context menu -->
        <div class="inner-child" id="inner-child">
            Inner Child
        </div>
    </div>
</div>

CSS:

.outer-child {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 200px;
    height: 200px;
    border: 1px solid red;
    background: green;
}
.inner-child {
    position: absolute;
    top: 50px;
    left: 50px;
    width: 100px;
    height: 100px;
    border: 1px solid blue;
    background: yellow;
}

JavaScript的:

// …

我正在使用Adam Shaw的FullCalendar控件以及jQuery.我想为事件和日子添加一个上下文菜单.通过使用Martin Wendt的Context Menu控件,我能够实现这一目标.我在事件上注册菜单的代码如下所示:

$('#calendar').fullCalendar({
        // Other arguments
        eventRender: function (event, element) {
            var originalClass = element[0].className;
            element[0].className = originalClass + ' hasmenu';
        },
        dayRender: function (day, cell) {
            var originalClass = cell[0].className;
            cell[0].className = originalClass + ' hasmenu';
    });
});

我实际上是hasmenu在日历中添加一个调用每个事件和日期的类.

$(document).contextmenu({
    delegate: ".hasmenu",
    preventContextMenuForPopup: true,
    preventSelect: true,
    menu: [
            {title: "Cut", cmd: "cut", uiIcon: "ui-icon-scissors"},
            {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
            {title: "Paste", cmd: "paste", uiIcon: "ui-icon-clipboard", disabled: true },
        ],
    select: …

右键单击时，如何使用http://jqueryui.com/menu/作为上下文菜单。有插件吗？

的jquery-1.9.0 jquery-ui-1.10.0