library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2025-01-07 20:34:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Menu: Implemented destroy method and disabled option, modified test to pass html-compare-destroy test and extended default visual test for testing destroy and disabled features

Browse Source
This commit is contained in:
jzaefferer 2010-06-18 10:57:20 +02:00
parent 921e40faff
commit b376fa8dda
3 changed files with 56 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
tests/unit/menu/menu.html
View File

@ -59,12 +59,12 @@
<div id="main" class="mainOnMoon"> <div id="main" class="mainOnMoon">
<ul id="menu1"> <ul class="foo" id="menu1">
<li><a href="#">Aberdeen</a></li> <li class="foo"><a class="foo" href="#">Aberdeen</a></li>
<li><a href="#">Ada</a></li> <li class="foo"><a class="foo" href="#">Ada</a></li>
<li><a href="#">Adamsville</a></li> <li class="foo"><a class="foo" href="#">Adamsville</a></li>
<li><a href="#">Addyston</a></li> <li class="foo"><a class="foo" href="#">Addyston</a></li>
<li><a href="#">Adelphi</a></li> <li class="foo"><a class="foo" href="#">Adelphi</a></li>
</ul> </ul>
<div id="log"></div> <div id="log"></div>

26
tests/visual/menu/menu.html
View File

@ -17,12 +17,25 @@
top: 10 top: 10
}).appendTo(document.body).themeswitcher(); }).appendTo(document.body).themeswitcher();
$("#menu1, #menu2").menu({ function create() {
select: function(event, ui) { menus.menu({
$("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); select: function(event, ui) {
} $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
}); }
});
}
var menus = $("#menu1, #menu2");
create();
$("#toggle-destroy").toggle(function() {
menus.menu("destroy");
}, create);
$("#toggle-disable").toggle(function() {
menus.menu("disable");
}, function() {
menus.menu("enable");
});
}); });
</script> </script>
<style> <style>
@ -87,5 +100,8 @@
<div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div> <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div> </div>
<button id="toggle-disable">Disable / Enable</button>
<button id="toggle-destroy">Destroy / Create</button>
</body> </body>
</html> </html>

33
ui/jquery.ui.menu.js vendored
View File

@ -23,6 +23,9 @@ $.widget("ui.menu", {
"aria-activedescendant": "ui-active-menuitem" "aria-activedescendant": "ui-active-menuitem"
}) })
.click(function( event ) { .click(function( event ) {
if (self.options.disabled) {
return false;
}
if ( !$( event.target ).closest( ".ui-menu-item a" ).length ) { if ( !$( event.target ).closest( ".ui-menu-item a" ).length ) {
return; return;
} }
@ -36,6 +39,9 @@ $.widget("ui.menu", {
this.options.input = this.element.attr("tabindex", 0); this.options.input = this.element.attr("tabindex", 0);
} }
this.options.input.bind("keydown.menu", function(event) { this.options.input.bind("keydown.menu", function(event) {
if (self.options.disabled) {
return;
}
switch (event.keyCode) { switch (event.keyCode) {
case $.ui.keyCode.PAGE_UP: case $.ui.keyCode.PAGE_UP:
self.previousPage(); self.previousPage();
@ -67,8 +73,21 @@ $.widget("ui.menu", {
}, },
destroy: function() { destroy: function() {
// TODO implement destroy $.Widget.prototype.destroy.apply(this, arguments);
$.Widget.prototype.apply(this, arguments);
this.element
.removeClass("ui-menu ui-widget ui-widget-content ui-corner-all")
.removeAttr("tabindex")
.removeAttr("role")
.removeAttr("aria-activedescendant");
this.element.children(".ui-menu-item")
.removeClass("ui-menu-item")
.removeAttr("role")
.children("a")
.removeClass("ui-corner-all")
.removeAttr("tabindex")
.unbind(".menu");
}, },
refresh: function() { refresh: function() {
@ -83,10 +102,16 @@ $.widget("ui.menu", {
.addClass("ui-corner-all") .addClass("ui-corner-all")
.attr("tabindex", -1) .attr("tabindex", -1)
// mouseenter doesn't work with event delegation // mouseenter doesn't work with event delegation
.mouseenter(function( event ) { .bind("mouseenter.menu", function( event ) {
if (self.options.disabled) {
return;
}
self.activate( event, $(this).parent() ); self.activate( event, $(this).parent() );
}) })
.mouseleave(function() { .bind("mouseleave.menu", function() {
if (self.options.disabled) {
return;
}
self.deactivate(); self.deactivate();
}); });
}, },