#7228 closed bug (invalid)
'HOVER' ASSIGNED VIA LIVE() OR DELEGATE() CONFUSES THE MOUSEENTER EVENT WITH MOUSEOVER WHEN TRIGGERED MANUALLY
Reported by: | patrickwhalen | Owned by: | |
---|---|---|---|
Priority: | undecided | Milestone: | 1.4.4 |
Component: | unfiled | Version: | 1.4.3 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
(All reference to mouseenter/mouseover can likewise be applied to mouseleave/mouseout.)
New bug introduced into jQuery 1.4.3.
When assigning hover
via .delegate()
or .live()
, if you position your mouse pointer over the element, it now receives a mouseenter
.
That's fine.
The trouble is that now nothing happens when manually triggering the mouseenter
.
Yet when manually triggering mouseover
, it triggers the mouseenter
event.
Example: http://jsfiddle.net/RuXEL/
<div> <span>I'm a SPAN</span> </div> <a href='#' id='triggerME'>Click to manually trigger MOUSEENTER</a> <a href='#' id='triggerMO'>Click to manually trigger MOUSEOVER</a>
$('div').delegate('span', 'hover', function(e) { $(this).toggleClass('hilite', e.type === 'mouseenter'); $('body').append('<br>SPAN received: ' + e.type); }); $('#triggerME').click(function(e) { // Nothing happens $('span').trigger('mouseenter'); e.preventDefault(); }); $('#triggerMO').click(function(e) { // Triggers a mouseenter instead of mouseover $('span').trigger('mouseover'); e.preventDefault(); });
This issue manifest itself in a project where previously a hover
assigned via .delegate()
on one element would receive a mouseover
, which it then fired on a related element that also had a hover
assigned via .delegate()
.
Because the event.type received via the mouse pointer on the primary element could be used to trigger the same event on the related element, it would work.
But now that the primary element receives a mouseenter
, but triggering mouseenter
no longer has any effect, the code is broken.
The temporary fix was when a mouseenter
was received by the primary, it would instead trigger a mouseover
on the related element, which will then receive its mouseenter
.
e.type = (e.type === 'mouseenter') ? 'mouseover' : (e.type === 'mouseleave') ? "mouseout" : e.type; $relatedElem.trigger( e.type );
Change History (2)
comment:1 follow-up: 2 Changed 12 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
comment:2 Changed 12 years ago by
Replying to snover:
mouseenter
does not bubble, so of course you cannot trigger it manually on an element and expect it to bubble up to the delegate handler.
Yes I'm aware, but mouseenter
is reported as the event.type
that bubbled up to trigger the .delegate()
handler. As such, it would seem that the same should be available to manually trigger it.
Additionally it seems to add confusion when a manually triggered mouseover
is reported as a mouseenter
.
My understanding is that jQuery manually bubbles its events. Perhaps I'm mistaken about that, but if it is the case, then there can be no expectation for how an event does/does not bubble since it is not determined by the natural characteristics of the event type.
These are just my opinions. No need to reply. I'll be content with my workaround. :o)
mouseenter
does not bubble, so of course you cannot trigger it manually on an element and expect it to bubble up to the delegate handler.