动态上下文菜单不与 jQuery 一起显示答案

【问题标题】：Dynamic context menu Not showing up with jQuery动态上下文菜单不与 jQuery 一起显示
【发布时间】：2013-11-23 09:48:25
【问题描述】：

我正在开发一个可视化 Web 编辑器项目。它是一个网页，顶部有一个输入文本，用户在其中输入网站名称，网站在输入字段下方加载（网站用户可以输入仅限于由我们公司）。

加载的页面类似于实际网站，所有锚链接设置为“#”，所有按钮和表单返回 false。意味着用户将停留在页面上并且无法导航到加载的网站的其他页面......

每个元素用户悬停都会被勾勒出来，点击元素后，用户会被提示一个他可以用点击的元素做的事情的列表。例如如果他点击图片，他可以更改图片或增加/减少宽度/高度。

我成功获取了元素，但无法获取上下文菜单...它没有显示，因为加载的页面有自己的 jquery 并且覆盖了我的。 .Firebug 说“TypeError: $.contextMenu 不是函数” .. 但是当没有加载网站时它工作正常

我知道理解我真正想说的话有点令人困惑，所以我附上了我正在编写的代码的 sn-p。它可能会帮助您理解。

<script src="jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="src/jquery.contextMenu.js" type="text/javascript"></script>

<script>
$(function(){

  $.contextMenu({
        selector: 'body', 
        trigger: 'left',
        callback: function(key, options) {
            var m = "clicked: " + key;
            window.console && console.log(m) || alert(m); 
        },
        items: {
            "edit": {name: "Edit", icon: "edit"},
            "cut": {name: "Cut", icon: "cut"},
            "copy": {name: "Copy", icon: "copy"},
            "paste": {name: "Paste", icon: "paste"},
            "delete": {name: "Delete", icon: "delete"},
            "sep1": "---------",
            "quit": {name: "Quit", icon: "quit"}
        }
    }); 

 /*  other code goes here */
</script>

<body>
<form method="post" action="crossdomain" id="mzwebsubmit">
    <input type="text" name="websitename" class="mzweb" value="${websitename }"> 
    <input type="submit" class="mzwebsubmit">  
</form>
<form method="post" action="crossdomain" id="finalpageform">
    <input type="hidden" name="finalpage" id="finalpage" class="mzweb" > 
    <input type="submit" value="Save" class="mzweb">
</form>

<hr>
<hr>
<!-- Website Loads in this DIV -->
<div id="visualwebload">${data }</div>

我正在身体上尝试它，以便至少它应该出现在我点击的任何地方，但它没有做任何事情。如果我没有加载网站，那么它可以完美运行。因此，任何人都可以建议我如何避免这些问题并获得动态上下文菜单。正确包含所有上下文菜单依赖项。

【问题讨论】：

你试过把你的代码放到 $(document).ready(function() {/*Here go your code*/}); ??我不认为 $(function(){}) 会等待你网站的所有 dom 被加载:)
不，它不起作用...... :(......Firebug 说“TypeError: $.contextMenu is not a function”在没有加载网站时工作正常
确保 jquery.contextMenu.js 被加载到网页中
我已经检查过了..它加载正确..正如我所说，如果我没有加载网站，上下文菜单就可以正常工作。
有人请帮我解决这个问题

标签： javascript jquery html

【解决方案1】：

我同意 Murali Mopuru 的观点，它看起来像是一个参考问题。请再次确认，src="src/jquery.contextMenu.js" 是真正加载的。

【讨论】：

【解决方案2】：

你可以这样做：

$(document).ajaxSend(function () {
     $.contextMenu('destroy');
});

【讨论】：