Mouse right click on Firefox triggers click event

一世执手 提交于 2020-01-13 14:54:11

问题


I noticed that the mouse right click on Firefox triggers an addEventListener.

I tried this code on more browsers and more OS (IE 11-10-9, Safari, Chrome) and by pressing the mouse right click, only on Firefox the console.log message is always printed.

<div id="one-div" style="height:400px;width:500px;background-color:#000;"> click me </div>
<script>
    function cb(event, from){
        // if click is fired on <div> with:
        // left click, both EventListener will be printed.
        // right click, only the 'document' one will be printed.
        event.preventDefault();
        console.log(event + ' from: ' + from );
    }
    document.addEventListener('click', function(e){
        cb(e,'document');
    }, false);
    document.getElementById("one-div").addEventListener('click', function(e){
        cb(e,'one-div');
    }, false);
</script>

And also I noticed that, when the click is fired into the div, it triggers the document.addEventListener only. I searched on Firefox changelog but no news about this.

Can anyone explain this behavior? Thanks!


回答1:


By default, in all browsers right click event is captured by addEventListener('contextmenu'), otherwise a right click will open a window with some options (each browser has different one).

In Firefox, when you add addEventListener('click') to the document object, it will capture any mouse clicking events (left, right, wheel) on the document and it will disable this right click behavior.

In addition, this is what Mozilla documentation says in Mouse Events section, although the (ANY button) stuff is not activated until you add the listener to the document object

click: A pointing device button (ANY button; soon to be primary button only) has been pressed and released on an element.

*Note: still the above window is shown when you double click right mouse button, but not with a single click.



来源:https://stackoverflow.com/questions/43144995/mouse-right-click-on-firefox-triggers-click-event

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!