mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-12-07 06:14:24 +00:00
Tabs: Work around bad Safari/VoiceOver heuristics
Move disabled tab click handlers from the container to the tablist to prevent panel contents from being announced as clickable. Fixes #10098 Closes gh-1261
This commit is contained in:
parent
98583a6563
commit
b4fb51199d
42
ui/tabs.js
42
ui/tabs.js
@ -75,24 +75,7 @@ return $.widget( "ui.tabs", {
|
|||||||
|
|
||||||
this.element
|
this.element
|
||||||
.addClass( "ui-tabs ui-widget ui-widget-content ui-corner-all" )
|
.addClass( "ui-tabs ui-widget ui-widget-content ui-corner-all" )
|
||||||
.toggleClass( "ui-tabs-collapsible", options.collapsible )
|
.toggleClass( "ui-tabs-collapsible", options.collapsible );
|
||||||
// Prevent users from focusing disabled tabs via click
|
|
||||||
.delegate( ".ui-tabs-nav > li", "mousedown" + this.eventNamespace, function( event ) {
|
|
||||||
if ( $( this ).is( ".ui-state-disabled" ) ) {
|
|
||||||
event.preventDefault();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// support: IE <9
|
|
||||||
// Preventing the default action in mousedown doesn't prevent IE
|
|
||||||
// from focusing the element, so if the anchor gets focused, blur.
|
|
||||||
// We don't have to worry about focusing the previously focused
|
|
||||||
// element since clicking on a non-focusable element should focus
|
|
||||||
// the body anyway.
|
|
||||||
.delegate( ".ui-tabs-anchor", "focus" + this.eventNamespace, function() {
|
|
||||||
if ( $( this ).closest( "li" ).is( ".ui-state-disabled" ) ) {
|
|
||||||
this.blur();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
this._processTabs();
|
this._processTabs();
|
||||||
options.active = this._initialActive();
|
options.active = this._initialActive();
|
||||||
@ -393,7 +376,26 @@ return $.widget( "ui.tabs", {
|
|||||||
|
|
||||||
this.tablist = this._getList()
|
this.tablist = this._getList()
|
||||||
.addClass( "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" )
|
.addClass( "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" )
|
||||||
.attr( "role", "tablist" );
|
.attr( "role", "tablist" )
|
||||||
|
|
||||||
|
// Prevent users from focusing disabled tabs via click
|
||||||
|
.delegate( "> li", "mousedown" + this.eventNamespace, function( event ) {
|
||||||
|
if ( $( this ).is( ".ui-state-disabled" ) ) {
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// support: IE <9
|
||||||
|
// Preventing the default action in mousedown doesn't prevent IE
|
||||||
|
// from focusing the element, so if the anchor gets focused, blur.
|
||||||
|
// We don't have to worry about focusing the previously focused
|
||||||
|
// element since clicking on a non-focusable element should focus
|
||||||
|
// the body anyway.
|
||||||
|
.delegate( ".ui-tabs-anchor", "focus" + this.eventNamespace, function() {
|
||||||
|
if ( $( this ).closest( "li" ).is( ".ui-state-disabled" ) ) {
|
||||||
|
this.blur();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
this.tabs = this.tablist.find( "> li:has(a[href])" )
|
this.tabs = this.tablist.find( "> li:has(a[href])" )
|
||||||
.addClass( "ui-state-default ui-corner-top" )
|
.addClass( "ui-state-default ui-corner-top" )
|
||||||
@ -711,6 +713,8 @@ return $.widget( "ui.tabs", {
|
|||||||
.removeAttr( "tabIndex" )
|
.removeAttr( "tabIndex" )
|
||||||
.removeUniqueId();
|
.removeUniqueId();
|
||||||
|
|
||||||
|
this.tablist.unbind( this.eventNamespace );
|
||||||
|
|
||||||
this.tabs.add( this.panels ).each(function() {
|
this.tabs.add( this.panels ).each(function() {
|
||||||
if ( $.data( this, "ui-tabs-destroy" ) ) {
|
if ( $.data( this, "ui-tabs-destroy" ) ) {
|
||||||
$( this ).remove();
|
$( this ).remove();
|
||||||
|
Loading…
Reference in New Issue
Block a user