javascript - 拉斐尔:禁用右键单击时的默认上下文菜单不起作用

Question

按照 this question 的回答我正在尝试禁用默认浏览器上下文菜单并显示自定义菜单。正如您在 jsfiddle 中看到的那样，右键单击会显示矩形，但会显示默认菜单。我尝试了 Chrome 和 IE，结果是一样的。这段代码有什么问题？

这是 HTML:

<div id="canvas"></div>

这是CSS:

#canvas {
  width: 500px;
  border: 1px solid #aaa;
}

和 JavaScript:

    var menu = null;
    var paper = new Raphael(document.getElementById('canvas'), 500, 500);
    var rect2 = paper.rect(100, 100, 180, 180 ).attr({"fill" : "green" });

    rect2.node.oncontextmenu = function(){ return false; }

    rect2.mousedown(function(e) {

        if ( e.which != 3 ) // only allow right click
            return;

        menu = paper.rect ( e.offsetX, e.offsetY, 100, 100).attr({stroke: '#000000', fill:'#c2c2c2',"stroke-width":1});
    });

Answer 1

您必须取消默认操作

function eventHandler(e){
    e = e || window.event;

    if(e.stopPropagation)
        e.stopPropagation();
    if(e.preventDefault)
        e.preventDefault();
    e.cancelBubble = false;

    return false;
}

http://jsfiddle.net/8Zy3F/3/

http://jsfiddle.net/tSGC5/