Question

好吧，经过几个小时试图找到一些东西后，我不得不在这里问一下，我可能会再问一次（我发现了类似的问题，但没有一个能帮助我）。

我正在尝试使用通过AJAX动态加载的页面上的自定义上下文菜单 - 所有内容都使用jQuery。问题是上下文菜单在动态加载的页面上不起作用...根本没有显示任何菜单。

我已经发现使用.live（）是一个解决方案，但仍然无法使其正常工作。以下是我对此ContextMenu plugin的最后一次尝试（仅使用示例代码）：

<script type="text/javascript">
    $(document).live("load", function() {
        $('#testtt').contextMenu('testtt', {
            bindings: {
                'open': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Open');
                },
                'email': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Email');
                },
                'save': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Save');
                },
                'delete': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Delete');
                }
            }
        })
    });

</script>
<div id="testtt">test</div>

这是动态加载的页面上的重要路径。

我也在使用jQuery UI Sortable，但这不应该是问题。

感谢您提供的每一个有用的解决方案。

Answer 1

移动你的$（'＃testtt'）。contextMenu ...调用你的Ajax success（）方法，如下所示。这将确保在您的数据加载并显示在屏幕上之后连接上下文菜单。它应该是Ajax成功的最后一件事（）。或者它可以进入Ajax complete（）。

$.ajax({
    type: 'GET',
    url: 'PATH TO URL',
    success: function(){
        $('#testtt').contextMenu('testtt', {
            bindings: {
                'open': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Open');
                },
                'email': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Email');
                },
                'save': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Save');
                },
                'delete': function(t) {
                    alert('Trigger was '+t.id+'\nAction was Delete');
                }
            }
        });
    }
});

AJAX加载内容中的jQuery上下文菜单

1 个答案: