From: John Resig <jeresig@gmail.com>
Date: Mon, 5 Jan 2009 17:34:42 +0000 (+0000)
Subject: Landed cross-browser support for tabIndex, by Scott, closes ticket #3649.
X-Git-Url: http://git.asbjorn.it/?p=jquery.git;a=commitdiff_plain;h=122b672f704cca094de50dfef05e88faa84cb51d

Landed cross-browser support for tabIndex, by Scott, closes ticket #3649.
---

diff --git a/src/core.js b/src/core.js
index 4eab2cd..d779061 100644
--- a/src/core.js
+++ b/src/core.js
@@ -970,6 +970,13 @@ jQuery.extend({
 				if( jQuery.nodeName( elem, "form" ) && elem.getAttributeNode(name) )
 					return elem.getAttributeNode( name ).nodeValue;
 
+				// elem.tabindex doesn't always return the correct value
+				// http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/
+				if ( name == jQuery.props.tabindex ) {
+					var attributeNode = elem.getAttributeNode(jQuery.props.tabindex);
+					return attributeNode && attributeNode.specified && attributeNode.value || undefined;
+				}
+
 				return elem[ name ];
 			}
 
diff --git a/src/support.js b/src/support.js
index 6d6bbce..c334e78 100644
--- a/src/support.js
+++ b/src/support.js
@@ -51,6 +51,10 @@
 		// (IE uses styleFloat instead of cssFloat)
 		cssFloat: !!a.style.cssFloat,
 
+		// Verify tabindex attribute existence
+		// (IE uses tabIndex instead of tabindex)
+		tabindex: !a.getAttributeNode('tabindex'),
+
 		// Will be defined later
 		scriptEval: false,
 		noCloneEvent: true
@@ -96,5 +100,6 @@ jQuery.props = {
 	readonly: "readOnly",
 	maxlength: "maxLength",
 	cellspacing: "cellSpacing",
-	rowspan: "rowSpan"
+	rowspan: "rowSpan",
+	tabindex: jQuery.support.tabindex ? "tabindex" : "tabIndex"
 };
diff --git a/test/index.html b/test/index.html
index c4ba752..30e955c 100644
--- a/test/index.html
+++ b/test/index.html
@@ -195,6 +195,20 @@ Z</textarea>
 				<div><div class="hidden">hidden</div></div>
 			</div>
 		</div>
+		
+		<div id="tabindex-tests">
+			<ol id="listWithTabIndex" tabindex="0">
+				<li id="foodWithNegativeTabIndex" tabindex="-1">Rice</li>
+				<li id="foodNoTabIndex">Beans</li>
+				<li>Blinis</li>
+				<li>Tofu</li>
+			</ol>
+		
+			<div id="divWithNoTabIndex">I'm hungry. I should...</div>
+			<span>...</span><a href="#" id="linkWithNoTabIndex">Eat lots of food</a><span>...</span> |
+			<span>...</span><a href="#" id="linkWithTabIndex" tabindex="2">Eat a little food</a><span>...</span> |
+			<span>...</span><a href="#" id="linkWithNegativeTabIndex" tabindex="-1">Eat no food</a><span>...</span>
+		</div>
 	</div>
 	</dl>
 	
diff --git a/test/unit/core.js b/test/unit/core.js
index ae8490e..07011e8 100644
--- a/test/unit/core.js
+++ b/test/unit/core.js
@@ -545,6 +545,62 @@ if ( !isLocal ) {
 	});
 }
 
+test("attr('tabindex')", function() {
+	expect(5);
+
+	// tabindex 0
+	equals(jQuery('#listWithTabIndex').attr('tabindex'), 0, 'tabindex of 0');
+
+	// positive tabindex
+	equals(jQuery('#linkWithTabIndex').attr('tabindex'), 2, 'tabindex of 2');
+
+	// negative tabindex
+	equals(jQuery('#linkWithNegativeTabIndex').attr('tabindex'), -1, 'negative tabindex');
+
+	// regular element without a tabindex
+	equals(jQuery('#divWithNoTabIndex').attr('tabindex'), undefined, 'no tabindex, not tabbable by default');
+
+    // link without a tabindex
+	equals(jQuery('#linkWithNoTabIndex').attr('tabindex'), undefined, 'no tabindex, tabbable by default');
+});
+
+test("attr('tabindex', value)", function() {
+	expect(9);
+
+	var element = jQuery('#divWithNoTabIndex');
+	equals(element.attr('tabindex'), undefined, 'start with no tabindex');
+
+	// set a positive string
+	element.attr('tabindex', '1');
+	equals(element.attr('tabindex'), 1, 'set tabindex to 1 (string)');
+
+	// set a zero string
+	element.attr('tabindex', '0');
+	equals(element.attr('tabindex'), 0, 'set tabindex to 0 (string)');
+
+	// set a negative string
+	element.attr('tabindex', '-1');
+	equals(element.attr('tabindex'), -1, 'set tabindex to -1 (string)');
+	
+	// set a positive number
+	element.attr('tabindex', 1);
+	equals(element.attr('tabindex'), 1, 'set tabindex to 1 (number)');
+
+	// set a zero number
+	element.attr('tabindex', 0);
+	equals(element.attr('tabindex'), 0, 'set tabindex to 0 (number)');
+
+	// set a negative number
+	element.attr('tabindex', -1);
+	equals(element.attr('tabindex'), -1, 'set tabindex to -1 (number)');
+	
+	element = jQuery('#linkWithTabIndex');
+	equals(element.attr('tabindex'), 2, 'start with tabindex 2');
+
+	element.attr('tabindex', -1);
+	equals(element.attr('tabindex'), -1, 'set negative tabindex');
+});
+
 test("css(String|Hash)", function() {
 	expect(19);
 
diff --git a/test/unit/selector.js b/test/unit/selector.js
index b3f198a..c49b76c 100644
--- a/test/unit/selector.js
+++ b/test/unit/selector.js
@@ -235,7 +235,7 @@ test("pseudo (:) selectors", function() {
 	t( "Selected Option Element", "#form option:selected", ["option1a","option2d","option3b","option3c"] );
 	t( "Text Contains", "a:contains('Google')", ["google","groups"] );
 	t( "Text Contains", "a:contains('Google Groups')", ["groups"] );
-	t( "Element Preceded By", "p ~ div", ["foo","fx-queue","fx-tests", "moretests"] );
+	t( "Element Preceded By", "p ~ div", ["foo","fx-queue","fx-tests", "moretests","tabindex-tests"] );
 	t( "Not", "a.blog:not(.link)", ["mark"] );
 	t( "Not - multiple", "#form option:not(:contains('Nothing'),#option1b,:selected)", ["option1c", "option1d", "option2b", "option2c", "option3d", "option3e"] );
 	//t( "Not - complex", "#form option:not([id^='opt']:nth-child(-n+3))", [ "option1a", "option1d", "option2d", "option3d", "option3e"] );