javascript - 右键单击在 Firefox 中不断传播

Question

我刚刚注意到一些不寻常的事情。这就是我想要实现的目标:

• 我希望在单击链接时显示一个 div

• 我希望当我单击文档中的其他位置时 div 消失

• 我不希望它在单击 div 本身时消失

类似这样的事情:

http://jsfiddle.net/XPmyF/

JS:

(function() {
    var box = $('#box');
    $(document).on('click', function() {
        if (box.css('display') == 'block') {
            box.css('display', 'none');
        }
    });
    $('#start').on('click', function(e) {
        box.css({
            'text': 'Box',
            'position': 'absolute',
            'top': '50px',
            'left': '0',
            'background': '#EEE',
            'border': '1px solid #555',
            'width': '200px',
            'height': '50px',
            'display': 'block'
        });
        e.stopPropagation();
    });

    box.on('click', function(e) {
        e.stopPropagation();
    });
})();​

那个 fiddle 工作得很好，但是当我在 Firefox (15.0.1) 中测试它时，如果右键单击 div，它就会消失，这不是我正在寻找的行为。看来 stopPropagation() 适用于点击，但不适用于 Firefox 中的右键单击。 Chrome 会阻止右键单击传播到文档。

我该如何解决这个问题？

谢谢

Answer 1

使用 event.which 方法来检测单击了哪个按钮。这是 jsfiddle 中的示例.

$(document).on('click', function(event) {
    if (event.which == 1 && box.css('display') == 'block') {
        box.css('display', 'none');
    }
});