Adjust tabIndex propHook for modern browsers and return -1 where appropriate. Close gh-1228.

This commit is contained in:
Oleg Gaidarenko 2013-04-08 21:33:17 -04:00 committed by Timmy Willison
parent 52394ba986
commit f1ba486ee3
3 changed files with 25 additions and 27 deletions

View File

@ -1,8 +1,7 @@
var nodeHook, boolHook, var nodeHook, boolHook,
rclass = /[\t\r\n]/g, rclass = /[\t\r\n]/g,
rreturn = /\r/g, rreturn = /\r/g,
rfocusable = /^(?:input|select|textarea|button|object)$/i, rfocusable = /^(?:input|select|textarea|button)$/i;
rclickable = /^(?:a|area)$/i;
jQuery.fn.extend({ jQuery.fn.extend({
attr: function( name, value ) { attr: function( name, value ) {
@ -395,35 +394,23 @@ jQuery.extend({
} }
if ( value !== undefined ) { if ( value !== undefined ) {
if ( hooks && "set" in hooks && (ret = hooks.set( elem, value, name )) !== undefined ) { return hooks && "set" in hooks && (ret = hooks.set( elem, value, name )) !== undefined ?
return ret; ret :
( elem[ name ] = value );
} else { } else {
return ( elem[ name ] = value ); return hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== null ?
} ret :
elem[ name ];
} else {
if ( hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== null ) {
return ret;
} else {
return elem[ name ];
}
} }
}, },
propHooks: { propHooks: {
tabIndex: { tabIndex: {
get: function( elem ) { get: function( elem ) {
// elem.tabIndex doesn't always return the correct value when it hasn't been explicitly set return elem.hasAttribute( "tabindex" ) || rfocusable.test( elem.nodeName ) || elem.href ?
// http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/ elem.tabIndex :
var attributeNode = elem.getAttributeNode("tabindex"); -1;
return attributeNode && attributeNode.specified ?
parseInt( attributeNode.value, 10 ) :
rfocusable.test( elem.nodeName ) || rclickable.test( elem.nodeName ) && elem.href ?
0 :
undefined;
} }
} }
} }

View File

@ -273,6 +273,12 @@ Z</textarea>
<span>...</span><a id="linkWithNoHrefWithNoTabIndex">Eat a burger</a><span>...</span> <span>...</span><a id="linkWithNoHrefWithNoTabIndex">Eat a burger</a><span>...</span>
<span>...</span><a id="linkWithNoHrefWithTabIndex" tabindex="1">Eat some funyuns</a><span>...</span> <span>...</span><a id="linkWithNoHrefWithTabIndex" tabindex="1">Eat some funyuns</a><span>...</span>
<span>...</span><a id="linkWithNoHrefWithNegativeTabIndex" tabindex="-1">Eat some funyuns</a><span>...</span> <span>...</span><a id="linkWithNoHrefWithNegativeTabIndex" tabindex="-1">Eat some funyuns</a><span>...</span>
<input id="inputWithoutTabIndex"/>
<button id="buttonWithoutTabIndex"></button>
<textarea id="textareaWithoutTabIndex"></textarea>
<menu type="popup">
<menuitem id="menuitemWithoutTabIndex" command="submitbutton" default/>
</menu>
</div> </div>
<div id="liveHandlerOrder"> <div id="liveHandlerOrder">

View File

@ -683,11 +683,16 @@ test( "prop(String, Object)", function() {
}); });
test( "prop('tabindex')", function() { test( "prop('tabindex')", function() {
expect( 8 ); expect( 11 );
// inputs without tabIndex attribute
equal( jQuery("#inputWithoutTabIndex").prop("tabindex"), 0, "input without tabindex" );
equal( jQuery("#buttonWithoutTabIndex").prop("tabindex"), 0, "button without tabindex" );
equal( jQuery("#textareaWithoutTabIndex").prop("tabindex"), 0, "textarea without tabindex" );
// elements not natively tabbable // elements not natively tabbable
equal( jQuery("#listWithTabIndex").prop("tabindex"), 5, "not natively tabbable, with tabindex set to 0" ); equal( jQuery("#listWithTabIndex").prop("tabindex"), 5, "not natively tabbable, with tabindex set to 0" );
equal( jQuery("#divWithNoTabIndex").prop("tabindex"), undefined, "not natively tabbable, no tabindex set" ); equal( jQuery("#divWithNoTabIndex").prop("tabindex"), -1, "not natively tabbable, no tabindex set" );
// anchor with href // anchor with href
equal( jQuery("#linkWithNoTabIndex").prop("tabindex"), 0, "anchor with href, no tabindex set" ); equal( jQuery("#linkWithNoTabIndex").prop("tabindex"), 0, "anchor with href, no tabindex set" );
@ -695,7 +700,7 @@ test( "prop('tabindex')", function() {
equal( jQuery("#linkWithNegativeTabIndex").prop("tabindex"), -1, "anchor with href, tabindex set to -1" ); equal( jQuery("#linkWithNegativeTabIndex").prop("tabindex"), -1, "anchor with href, tabindex set to -1" );
// anchor without href // anchor without href
equal( jQuery("#linkWithNoHrefWithNoTabIndex").prop("tabindex"), undefined, "anchor without href, no tabindex set" ); equal( jQuery("#linkWithNoHrefWithNoTabIndex").prop("tabindex"), -1, "anchor without href, no tabindex set" );
equal( jQuery("#linkWithNoHrefWithTabIndex").prop("tabindex"), 1, "anchor without href, tabindex set to 2" ); equal( jQuery("#linkWithNoHrefWithTabIndex").prop("tabindex"), 1, "anchor without href, tabindex set to 2" );
equal( jQuery("#linkWithNoHrefWithNegativeTabIndex").prop("tabindex"), -1, "anchor without href, no tabindex set" ); equal( jQuery("#linkWithNoHrefWithNegativeTabIndex").prop("tabindex"), -1, "anchor without href, no tabindex set" );
}); });
@ -705,7 +710,7 @@ test( "prop('tabindex', value)", 10, function() {
var clone, var clone,
element = jQuery("#divWithNoTabIndex"); element = jQuery("#divWithNoTabIndex");
equal( element.prop("tabindex"), undefined, "start with no tabindex" ); equal( element.prop("tabindex"), -1, "start with no tabindex" );
// set a positive string // set a positive string
element.prop( "tabindex", "1" ); element.prop( "tabindex", "1" );