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">
<ul id="menu1">
<li><a href="#">Aberdeen</a></li>
<li><a href="#">Ada</a></li>
<li><a href="#">Adamsville</a></li>
<li><a href="#">Addyston</a></li>
<li><a href="#">Adelphi</a></li>
<ul class="foo" id="menu1">
<li class="foo"><a class="foo" href="#">Aberdeen</a></li>
<li class="foo"><a class="foo" href="#">Ada</a></li>
<li class="foo"><a class="foo" href="#">Adamsville</a></li>
<li class="foo"><a class="foo" href="#">Addyston</a></li>
<li class="foo"><a class="foo" href="#">Adelphi</a></li>
</ul>
<div id="log"></div>

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

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

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

@ -23,6 +23,9 @@ $.widget("ui.menu", {
"aria-activedescendant": "ui-active-menuitem"
})
.click(function( event ) {
if (self.options.disabled) {
return false;
}
if ( !$( event.target ).closest( ".ui-menu-item a" ).length ) {
return;
}
@ -36,6 +39,9 @@ $.widget("ui.menu", {
this.options.input = this.element.attr("tabindex", 0);
}
this.options.input.bind("keydown.menu", function(event) {
if (self.options.disabled) {
return;
}
switch (event.keyCode) {
case $.ui.keyCode.PAGE_UP:
self.previousPage();
@ -67,8 +73,21 @@ $.widget("ui.menu", {
},
destroy: function() {
// TODO implement destroy
$.Widget.prototype.apply(this, arguments);
$.Widget.prototype.destroy.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() {
@ -83,10 +102,16 @@ $.widget("ui.menu", {
.addClass("ui-corner-all")
.attr("tabindex", -1)
// 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() );
})
.mouseleave(function() {
.bind("mouseleave.menu", function() {
if (self.options.disabled) {
return;
}
self.deactivate();
});
},