mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
Menu: Use event delegation for mouseover/out events, instead of binding to menu items directly
This commit is contained in:
parent
0746f99115
commit
6b3eead894
43
ui/jquery.ui.menu.js
vendored
43
ui/jquery.ui.menu.js
vendored
@ -23,7 +23,7 @@ $.widget("ui.menu", {
|
|||||||
"aria-activedescendant": "ui-active-menuitem"
|
"aria-activedescendant": "ui-active-menuitem"
|
||||||
})
|
})
|
||||||
.bind("click.menu", function( event ) {
|
.bind("click.menu", function( event ) {
|
||||||
if (self.options.disabled) {
|
if ( self.options.disabled ) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
if ( !$( event.target ).closest( ".ui-menu-item a" ).length ) {
|
if ( !$( event.target ).closest( ".ui-menu-item a" ).length ) {
|
||||||
@ -32,7 +32,25 @@ $.widget("ui.menu", {
|
|||||||
// temporary
|
// temporary
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
self.select( event );
|
self.select( event );
|
||||||
});
|
})
|
||||||
|
.bind("mouseover.menu", function( event ) {
|
||||||
|
if ( self.options.disabled ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var target = $( event.target ).closest( ".ui-menu-item" );
|
||||||
|
if ( target.length && target.parent()[0] === self.element[0] ) {
|
||||||
|
self.activate( event, target );
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.bind("mouseout.menu", function( event ) {
|
||||||
|
if ( self.options.disabled ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var target = $( event.target ).closest( ".ui-menu-item" );
|
||||||
|
if ( target.length && target.parent()[0] === self.element[0] ) {
|
||||||
|
self.deactivate( event );
|
||||||
|
}
|
||||||
|
});;
|
||||||
this.refresh();
|
this.refresh();
|
||||||
|
|
||||||
if (!this.options.input) {
|
if (!this.options.input) {
|
||||||
@ -91,8 +109,6 @@ $.widget("ui.menu", {
|
|||||||
},
|
},
|
||||||
|
|
||||||
refresh: function() {
|
refresh: function() {
|
||||||
var self = this;
|
|
||||||
|
|
||||||
// don't refresh list items that are already adapted
|
// don't refresh list items that are already adapted
|
||||||
var items = this.element.children("li:not(.ui-menu-item):has(a)")
|
var items = this.element.children("li:not(.ui-menu-item):has(a)")
|
||||||
.addClass("ui-menu-item")
|
.addClass("ui-menu-item")
|
||||||
@ -100,20 +116,7 @@ $.widget("ui.menu", {
|
|||||||
|
|
||||||
items.children("a")
|
items.children("a")
|
||||||
.addClass("ui-corner-all")
|
.addClass("ui-corner-all")
|
||||||
.attr("tabIndex", -1)
|
.attr("tabIndex", -1);
|
||||||
// mouseenter doesn't work with event delegation
|
|
||||||
.bind("mouseenter.menu", function( event ) {
|
|
||||||
if (self.options.disabled) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
self.activate( event, $(this).parent() );
|
|
||||||
})
|
|
||||||
.bind("mouseleave.menu", function() {
|
|
||||||
if (self.options.disabled) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
self.deactivate();
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
|
|
||||||
activate: function( event, item ) {
|
activate: function( event, item ) {
|
||||||
@ -136,13 +139,13 @@ $.widget("ui.menu", {
|
|||||||
this._trigger("focus", event, { item: item });
|
this._trigger("focus", event, { item: item });
|
||||||
},
|
},
|
||||||
|
|
||||||
deactivate: function() {
|
deactivate: function(event) {
|
||||||
if (!this.active) { return; }
|
if (!this.active) { return; }
|
||||||
|
|
||||||
this.active.children("a")
|
this.active.children("a")
|
||||||
.removeClass("ui-state-hover")
|
.removeClass("ui-state-hover")
|
||||||
.removeAttr("id");
|
.removeAttr("id");
|
||||||
this._trigger("blur");
|
this._trigger("blur", event);
|
||||||
this.active = null;
|
this.active = null;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user