Code-triggered mouseout should not trigger mouseleave on ancestor

Reported by:	jaredjacobs@gmail.com	Owned by:
Priority:	low	Milestone:	None
Component:	event	Version:	git
Keywords:		Cc:
Blocked by:		Blocking:

Description

If I call

$element.mouseout()

to run an element's mouseout handler, then jQuery also invokes any mouseleave handlers on the element's ancestors.

This is contrary to what http://api.jquery.com/mouseleave/ says:

The mouseleave event, on the other hand, only triggers its handler when the mouse leaves the element it is bound to, not a descendant.

Attachments (0)

Change History (4)

Changed February 11, 2013 10:22PM UTC by Jared Jacobs <jaredjacobs@gmail.com> comment:1

working example: http://jsfiddle.net/t8FTK/

Changed February 11, 2013 10:38PM UTC by dmethvin comment:2

component:	unfiled → event
priority:	undecided → low
status:	new → open

The best way to run handlers alone is with .triggerHandler(), doing it with .trigger() (or shortcut methods like .mouseout()) risks running DOM behaviors along with the handler.

This issue has been around since 1.7 so it must not be very commonly encountered. I suspect it's because the synthetic event isn't set up the same as the natural one.

Changed February 11, 2013 11:12PM UTC by Jared Jacobs <jaredjacobs@gmail.com> comment:3

Thanks for the feedback. I'm aware of

.triggerHandler}}. I'm using a {{{.trigger

shortcut method because the

mouseout

handler I want to run is registered on an ancestor via

.on

with a selector argument.

Agree that this is low priority, since a simple workaround is to avoid

.trigger

by using

.triggerHandler

or by naming the handler and invoking it directly.

Changed April 29, 2013 03:48PM UTC by dmethvin comment:4

resolution:	→ notabug
status:	open → closed

I looked at this and it the correct behavior for a triggered mouseout event if it's intended to emulate a real mouse event. If you want to just fire the handlers, .triggerHandler() is the right choice.

Side navigation