如何使用JavaScript拦截鼠标的各种按钮按下？

Question

我研究的Web应用程序是在只有2按钮鼠标的时期内设计和开发的。 现在，我们在市场上有超过3个按钮的鼠标可用，所有这些额外的按钮在使用我们的应用程序时都会造成严重破坏。

我的意图是允许用户仅按下鼠标左键并禁用其鼠标上的所有其他按钮。 由于我无权访问用户的系统，因此必须通过浏览器本身（可能使用JavaScript）以某种方式实现此目的。

我该如何解决这个问题？ 任何指针将非常有帮助。

Answer 1

W3C事件模型足以将鼠标信息传递通过event object 。 这意味着您实际上可以读取单击了哪个鼠标按钮。 例

document.body.addEventListener('click', function( event ) {
    console.log('mouse button clicked: ', event.which);
}, false);

有了这些信息，它非常琐碎，只允许用值1表示的左键单击 。

document.body.addEventListener('click', function( event ) {
    if( event.which === 1 ) {
        // do something
    } else {
        event.stopPropagation();
        event.preventDefault();
    }
}, false);

Answer 2

这取决于浏览器和文档模式。

这就是我们调整prototype.js按钮映射以在所有浏览器上工作的方式。 在docmode <9中包括IE10。

function _isButtonForDOMEvents(event, code) {
        return event.which ? (event.which === code + 1) : (event.button === code);
    }

    //var legacyButtonMap = { 0: 1, 1: 4, 2: 2 };
    function _isButtonForLegacyEvents(event, code) {
        switch (code) { //Fix where IE10 in DocMode lt9 caused isLeftClick to fail
            case 0: return event.button == 0 || event.button == 1;
            case 1: return event.button == 4;
            case 2: return event.button == 2;
            default: return false;
        }
    }

    function _isButtonForWebKit(event, code) {
        switch (code) {
            case 0: return event.which == 1 && !event.metaKey;
            case 1: return event.which == 2 || (event.which == 1 && event.metaKey);
            case 2: return event.which == 3;
            default: return false;
        }
    }

Answer 3

我认为这是禁用按钮最接近的方法

document.addEventListener('click', function( e ){
    if(e.which === 2 || e.which === 3) { // 2 = middle scroll button ||  3 = right click
        e.preventDefault();
        e.stopPropagation();
        return false;
    }
});

如果无法使用，请点击“ keydown”或“ keyup”，而不是单击