Changeset 29

Show
Ignore:
Timestamp:
12/14/07 12:48:20 (11 months ago)
Author:
simon
Message:

Added more test elements: a div that has a tabindex initially which is then removed, 3 input elements (no tabindex, tabindex="1", and initally with a tabindex which is then removed.)
Page now runs in other browsers (tested FF2 and Safari 3 Windows.)

Files:
1 modified

Legend:

Unmodified
Added
Removed

  • collected/trunk/html-test-cases/getting-tabindex-in-ie.html

    r28 r29  
    55 
    66<head> 
    7 <title>Using JavaScript to get the tabindex value 
    8 of an element in Internet Explorer</title> 
     7<title>Getting the tabindex value of an element with JavaScript</title> 
    98<script type="text/javascript"> 
    109function Logger(id){ 
    1110        this._id = id; 
    12         this._elemId = undefined; 
    13         this._elemMessage = ""; 
    1411} 
    15 Logger.prototype._getElem = function(){ 
    16         return document.getElementById(this._elemId); 
    17 }; 
    1812Logger.prototype._makeTd = function(text){ 
    1913        var td = document.createElement("td"); 
    … …  
    2115        return td; 
    2216}; 
    23 Logger.prototype.begin = function(elemId, elemMessage){ 
    24         this._elemId = elemId; 
    25         this._elemMessage = elemMessage; 
    26 }; 
    27 Logger.prototype.log = function(mechanism, value){ 
     17Logger.prototype.log = function(desc, mechanism, value){ 
    2818        var table = document.getElementById(this._id); 
    2919        var tbody = table.getElementsByTagName("tbody")[0]; 
    3020        var tr = document.createElement("tr"); 
    31         tr.appendChild(this._makeTd(this._elemMessage)); 
     21        tr.appendChild(this._makeTd(desc)); 
    3222        tr.appendChild(this._makeTd(mechanism)); 
    33         tr.appendChild(this._makeTd(value)); 
     23        if(value === null){ 
     24                tr.appendChild(this._makeTd("null")); 
     25        }else{ 
     26                tr.appendChild(this._makeTd(value)); 
     27        } 
    3428        tbody.appendChild(tr); 
    3529}; 
    36 Logger.prototype.logGetAttribute = function(attr, iFlags){ 
    37         if(arguments.length == 2){ 
    38                 this.log('getAttribute("' + attr + '", ' + iFlags + ")", 
    39                         this._getElem().getAttribute(attr, iFlags)); 
     30Logger.prototype.logGetAttribute = function(id, desc, attr, iFlags){ 
     31        var elem = document.getElementById(id); 
     32        if(arguments.length == 4){ 
     33                this.log(desc, 'elem.getAttribute("' + attr + '", ' + iFlags + ")", 
     34                        elem.getAttribute(attr, iFlags)); 
    4035        }else{ 
    41                 this.log('getAttribute("' + attr + '")', 
    42                         this._getElem().getAttribute(attr)); 
     36                this.log(desc, 'elem.getAttribute("' + attr + '")', 
     37                        elem.getAttribute(attr)); 
    4338        } 
    4439}; 
    45 Logger.prototype.logTabindexProperty = function(){ 
    46         this.log("tabindex", this._getElem().tabindex); 
     40Logger.prototype.logTabindexProperty = function(id, desc){ 
     41        var elem = document.getElementById(id); 
     42        this.log(desc, "elem.tabindex", elem.tabindex); 
    4743}; 
    48 Logger.prototype.logTabIndexProperty = function(){ 
    49         this.log("tabIndex", this._getElem().tabIndex); 
     44Logger.prototype.logTabIndexProperty = function(id, desc){ 
     45        var elem = document.getElementById(id); 
     46        this.log(desc, "elem.tabIndex", elem.tabIndex); 
    5047}; 
    51 Logger.prototype.logAttributes = function(attr){ 
    52         node = this._getElem().attributes[attr]; 
     48Logger.prototype.logAttributes = function(id, desc, attr){ 
     49        var node = document.getElementById(id).attributes[attr]; 
    5350        if(node){ 
    54                 this.log('attributes["' + attr + '"].nodeValue', node.nodeValue); 
     51                this.log(desc, 'elem.attributes["' + attr + '"].nodeValue', 
     52                        node.nodeValue); 
    5553        }else{ 
    56                 this.log('attributes["' + attr + '"]', node); 
     54                this.log(desc, 'elem.attributes["' + attr + '"]', node); 
    5755        } 
    5856}; 
    59 Logger.prototype.logTabindex = function(){ 
    60         this.logGetAttribute("tabindex"); 
    61         this.logGetAttribute("tabindex", 0); 
    62         this.logGetAttribute("tabindex", 1); 
    63         this.logGetAttribute("tabindex", 2); 
    64         this.logGetAttribute("tabIndex"); 
    65         this.logGetAttribute("tabIndex", 0); 
    66         this.logGetAttribute("tabIndex", 1); 
    67         this.logGetAttribute("tabIndex", 2); 
    68         this.logTabindexProperty(); 
    69         this.logTabIndexProperty(); 
    70         this.logAttributes("tabindex"); 
    71         this.logAttributes("tabIndex"); 
     57Logger.prototype.logTabindex = function(id, desc){ 
     58        this.logGetAttribute(id, desc, "tabindex"); 
     59        if(isIE()){ 
     60                this.logGetAttribute(id, desc, "tabindex", 0); 
     61                this.logGetAttribute(id, desc, "tabindex", 1); 
     62                this.logGetAttribute(id, desc, "tabindex", 2); 
     63        } 
     64        this.logGetAttribute(id, desc, "tabIndex"); 
     65        if(isIE()){ 
     66                this.logGetAttribute(id, desc, "tabIndex", 0); 
     67                this.logGetAttribute(id, desc, "tabIndex", 1); 
     68                this.logGetAttribute(id, desc, "tabIndex", 2); 
     69        } 
     70        this.logTabindexProperty(id, desc); 
     71        this.logTabIndexProperty(id, desc); 
     72        this.logAttributes(id, desc, "tabindex"); 
     73        this.logAttributes(id, desc, "tabIndex"); 
    7274}; 
    73 function logTabindexes(){ 
     75function isIE(){ 
     76        return navigator.userAgent.indexOf("MSIE") != -1; 
     77} 
     78function removeTabindex(id){ 
     79        var elem = document.getElementById(id); 
     80        if(isIE){ 
     81                elem.removeAttribute("tabIndex"); 
     82        }else{ 
     83                elem.removeAttribute("tabindex"); 
     84        } 
     85} 
     86function run(){ 
     87        var userAgentTextNode = document.createTextNode(navigator.userAgent); 
     88        document.getElementById("userAgent").appendChild(userAgentTextNode); 
     89        removeTabindex("div-tabindex-removed"); 
     90        removeTabindex("input-tabindex-removed"); 
    7491        logger = new Logger("log"); 
    75         logger.begin("div-no-tabindex", "div with no tabindex"); 
    76         logger.logTabindex(); 
    77         logger.begin("div-tabindex-1", 'div with tabindex="1"'); 
    78         logger.logTabindex(); 
     92        logger.logTabindex("div-no-tabindex", "div with no tabindex"); 
     93        logger.logTabindex("div-tabindex-1", 'div with tabindex="1"'); 
     94        logger.logTabindex("div-tabindex-removed", "div with tabindex removed"); 
     95        logger.logTabindex("input-no-tabindex", "input with no tabindex"); 
     96        logger.logTabindex("input-tabindex-1", 'input with tabindex="1"'); 
     97        logger.logTabindex("input-tabindex-removed", "input with tabindex removed"); 
    7998} 
    8099</script> 
    81100</head> 
    82101 
    83 <body onload="logTabindexes()"> 
    84 <div id="div-no-tabindex"></div> 
    85 <div id="div-tabindex-1" tabindex="1"></div> 
     102<body onload="run()"> 
     103<h2>User agent</h2> 
     104<div id="userAgent"></div> 
     105<h2>Results</h2> 
    86106<table id="log"> 
    87107<thead> 
    … …  
    90110<tbody></tbody> 
    91111</table> 
     112<hr> 
     113<div id="div-no-tabindex"></div> 
     114<div id="div-tabindex-1" tabindex="1"></div> 
     115<div id="div-tabindex-removed" tabindex="1"></div> 
     116<input id="input-no-tabindex"> 
     117<input id="input-tabindex-1" tabindex="1"> 
     118<input id="input-tabindex-removed" tabindex="1"> 
    92119</body> 
    93120