Skip to content

Commit 7d992ae

Browse files
committed
Menu: Handle mouse movement mixed with keyboard navigation
Fixes #9357 Closes jquerygh-1805
1 parent a3e953b commit 7d992ae

File tree

1 file changed

+33
-23
lines changed

1 file changed

+33
-23
lines changed

ui/widgets/menu.js

Lines changed: 33 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,8 @@ return $.widget( "ui.menu", {
7878
// them (focus should always stay on UL during navigation).
7979
"mousedown .ui-menu-item": function( event ) {
8080
event.preventDefault();
81+
82+
this._activateItem( event );
8183
},
8284
"click .ui-menu-item": function( event ) {
8385
var target = $( event.target );
@@ -107,29 +109,8 @@ return $.widget( "ui.menu", {
107109
}
108110
}
109111
},
110-
"mouseenter .ui-menu-item": function( event ) {
111-
112-
// Ignore mouse events while typeahead is active, see #10458.
113-
// Prevents focusing the wrong item when typeahead causes a scroll while the mouse
114-
// is over an item in the menu
115-
if ( this.previousFilter ) {
116-
return;
117-
}
118-
119-
var actualTarget = $( event.target ).closest( ".ui-menu-item" ),
120-
target = $( event.currentTarget );
121-
122-
// Ignore bubbled events on parent items, see #11641
123-
if ( actualTarget[ 0 ] !== target[ 0 ] ) {
124-
return;
125-
}
126-
127-
// Remove ui-state-active class from siblings of the newly focused menu item
128-
// to avoid a jump caused by adjacent elements both having a class with a border
129-
this._removeClass( target.siblings().children( ".ui-state-active" ),
130-
null, "ui-state-active" );
131-
this.focus( event, target );
132-
},
112+
"mouseenter .ui-menu-item": "_activateItem",
113+
"mousemove .ui-menu-item": "_activateItem",
133114
mouseleave: "collapseAll",
134115
"mouseleave .ui-menu": "collapseAll",
135116
focus: function( event, keepActiveItem ) {
@@ -171,6 +152,35 @@ return $.widget( "ui.menu", {
171152
} );
172153
},
173154

155+
_activateItem: function( event ) {
156+
157+
// Ignore mouse events while typeahead is active, see #10458.
158+
// Prevents focusing the wrong item when typeahead causes a scroll while the mouse
159+
// is over an item in the menu
160+
if ( this.previousFilter ) {
161+
return;
162+
}
163+
164+
var actualTarget = $( event.target ).closest( ".ui-menu-item" ),
165+
target = $( event.currentTarget );
166+
167+
// Ignore bubbled events on parent items, see #11641
168+
if ( actualTarget[ 0 ] !== target[ 0 ] ) {
169+
return;
170+
}
171+
172+
// If the item is already active, there's nothing to do
173+
if ( target.is( ".ui-state-active" ) ) {
174+
return;
175+
}
176+
177+
// Remove ui-state-active class from siblings of the newly focused menu item
178+
// to avoid a jump caused by adjacent elements both having a class with a border
179+
this._removeClass( target.siblings().children( ".ui-state-active" ),
180+
null, "ui-state-active" );
181+
this.focus( event, target );
182+
},
183+
174184
_destroy: function() {
175185
var items = this.element.find( ".ui-menu-item" )
176186
.removeAttr( "role aria-disabled" ),

0 commit comments

Comments
 (0)