Question

我正在尝试创建一个上下文菜单。当用户在画布（HTML5）中单击时，应显示上下文菜单，当单击菜单中的某个项时，应调用某些函数。

有人能帮助我吗？

Answer 1

请通过这个jsfiddle链接，这可能会帮助您实现这一目标。在这个例子中，橙色区域是画布，如果你右键单击它，它将显示上下文菜单。

function createCustomMenu()
{
     $(".box").unbind("click").bind("click", function (event) {
        // Avoid the real one
      event.preventDefault();

        $("#custom-menu").hide(100);
        // Show contextmenu
        if ($("#custom-menu").show() === true) {
            $("#custom-menu").hide(100)
            // In the right position (the mouse)
            css({
                top: event.pageY + "px",
                left: event.pageX + "px"
            });
        } else {
            $("#custom-menu").show(100).
            // In the right position (the mouse)
            css({
                top: event.pageY + "px",
                left: event.pageX + "px"
            });
        }            
    }); 
}

现在如果用户取消选中该复选框，则上下文菜单将被禁用。如果用户将检查，则只会显示上下文菜单。所以我已更新此链接，请参阅工作示例..

点击此链接查看jsfiddle示例： - http://jsfiddle.net/TnbYm/22/

使用此

单击即可创建上下文菜单

1 个答案: