Re: Question about event bubbling in FF versus IE and Chrome?

Hi Bryan,

On 2015-01-27 2:58 PM, Bryan Garaventa wrote:
>
> Thanks, the attachment just uses jQuery to bind the events.
>
> > Right clicks should not result in a click event regardless of other 
> events.
>
> **
>
> *That’s what I was trying to determine, in Firefox, if you right click 
> an element on the page, it bubbles an onClick to the document, where 
> it does not in IE or Chrome.*
>
> **
>

It's not clear that the click event is bubbling.

I added console messages to your event handlers as well as adding a 
"mouseup" handler to the document object.  In FF, when right clicking on 
the input, the sequence of events is:

- input:contextmenu
- document:contextmenu
- input:mouseup
- document:mouseup
- document:click

Both the "contextmenu" and "mouseup" events bubble from the input to the 
document.  The document click event is associated only with the 
document.  Since there is no "input:click" event, it does not appear to 
bubble up from anywhere.

I wrote:
> In order to stop bubbling, call event.stopPropagation().

I then added stopPropagation() to all of the event handlers bound to the 
input.  The results of a right click on the input in that case are:
- input:contextmenu
- input.mouseup
- document.click

The "contextmenu" and "mouseup" events no longer bubble up to the 
document.  There is still a "click" event associated with the document, 
and, again, only with the document.  I'm not sure why that happens.

I've attached the two files I used in the test:
- "mouseup_testOrig.html" is your original code with the added calls to 
console.log(), and the "mouseup" handler bound to the document.
- "mouseup_testStop.html"  is the same code but with 
event.stopPropagation() added to input's handlers.

-- 
;;;;joseph.

'Array(16).join("wat" - 1) + " Batman!"'
            - G. Bernhardt -