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 (file)
--- 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 (file)
--- 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 (file)
--- 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 (file)
--- 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 (file)
--- 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"] );