library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Tabs: mouseover/focus handling for added tabs, plus test, fixes #4097 as well as focus/blur handling when using keyboard

Browse Source
This commit is contained in:
Klaus Hartl 2009-02-13 23:05:16 +00:00
parent 82d7c67bd3
commit f3feb25712
2 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
tests/unit/tabs/tabs_methods.js
View File

@ -43,6 +43,18 @@ test('disable', function() {
}); });
test('add', function() { test('add', function() {
expect(3);
el = $('#tabs1').tabs();
el.tabs('add', "#new", 'New');
var added = $('li:last', el).simulate('mouseover');
ok(added.is('.ui-state-hover'), 'should add mouseover handler to added tab');
added.simulate('mouseout');
var other = $('li:first', el).simulate('mouseover');
ok(other.is('.ui-state-hover'), 'should not remove mouseover handler from existing tab');
other.simulate('mouseout');
ok(false, "missing test - untested code is broken code."); ok(false, "missing test - untested code is broken code.");
}); });

34
ui/ui.tabs.js
View File

@ -172,20 +172,6 @@ $.widget("ui.tabs", {
else onShow(); else onShow();
} }
// states
if (o.event != 'mouseover') {
var handleState = function(state, el) {
if (el.is(':not(.ui-state-disabled)')) el.toggleClass('ui-state-' + state);
};
this.$lis.bind('mouseover.tabs mouseout.tabs', function() {
handleState('hover', $(this));
});
// TODO focus/blur don't seem to work with namespace
this.$tabs.bind('focus.tabs blur.tabs', function() {
handleState('focus', $(this).parents('li:first'));
});
}
// clean up to avoid memory leaks in certain versions of IE 6 // clean up to avoid memory leaks in certain versions of IE 6
$(window).bind('unload', function() { $(window).bind('unload', function() {
self.$lis.add(self.$tabs).unbind('.tabs'); self.$lis.add(self.$tabs).unbind('.tabs');
@ -194,8 +180,9 @@ $.widget("ui.tabs", {
} }
// update selected after add/remove // update selected after add/remove
else else {
o.selected = this.$lis.index(this.$lis.filter('.ui-tabs-selected')); o.selected = this.$lis.index(this.$lis.filter('.ui-tabs-selected'));
}
// update collapsible // update collapsible
this.element[o.collapsible ? 'addClass' : 'removeClass']('ui-tabs-collapsible'); this.element[o.collapsible ? 'addClass' : 'removeClass']('ui-tabs-collapsible');
@ -210,6 +197,21 @@ $.widget("ui.tabs", {
// reset cache if switching from cached to not cached // reset cache if switching from cached to not cached
if (o.cache === false) this.$tabs.removeData('cache.tabs'); if (o.cache === false) this.$tabs.removeData('cache.tabs');
// remove all handlers before, tabify may run on existing tabs after add or option change
this.$lis.add(this.$tabs).unbind('.tabs');
if (o.event != 'mouseover') {
var handleState = function(state, el) {
if (el.is(':not(.ui-state-disabled)')) el.toggleClass('ui-state-' + state);
};
this.$lis.bind('mouseover.tabs mouseout.tabs', function() {
handleState('hover', $(this));
});
this.$tabs.bind('focus.tabs blur.tabs', function() {
handleState('focus', $(this).parents('li:first'));
});
}
// set up animations // set up animations
var hideFx, showFx; var hideFx, showFx;
if (o.fx) { if (o.fx) {
@ -264,7 +266,7 @@ $.widget("ui.tabs", {
} }
// attach tab event handler, unbind to avoid duplicates from former tabifying... // attach tab event handler, unbind to avoid duplicates from former tabifying...
this.$tabs.unbind('.tabs').bind(o.event + '.tabs', function() { this.$tabs.bind(o.event + '.tabs', function() {
var $li = $(this).parents('li:eq(0)'), var $li = $(this).parents('li:eq(0)'),
$hide = self.$panels.filter(':visible'), $hide = self.$panels.filter(':visible'),
$show = $(self._sanitizeSelector(this.hash)); $show = $(self._sanitizeSelector(this.hash));