tabIndex 主要是美化tab键切换的体现

原帖：http://www.cnblogs.com/rubylouvre/archive/2009/12/07/1618182.html

跟随司徒正美兄的一个实践。

window.onload = function(){
            var inputs = document.getElementsByTagName('input');
            for(var i=0, n=inputs.length; i<n; i++){
                inputs[i].style.cssText = 'background:#eee; border:1px solid #ccc;';
                inputs[i].onfocus = function(){
                    this.style.cssText = 'background:#7ecef4; border:1px solid #00a0e9;';
                }
                inputs[i].onblur = function(){
                    this.style.cssText = 'background:#eee; border:1px solid #ccc;';
                }
            }
        }

 

HTML结构：

<form name="myForm">
            <input tabindex="1" value="第一个">第一个<br />
            <input tabindex="3" value="第三个">第三个<br />
            <input tabindex="2" value="第二个">第二个<br />
            <input tabindex="5" value="第五个">第五个<br />
            <input tabindex="4" value="第四个">第四个<br />
            <input tabindex="6" value="第六个">第六个<br />
        </form>