tabindex解决DIV获得焦点的问题(转)

首先tabindex是Tab键焦点跳跃的顺序。

<div class="title">关于元素获取焦点：</div>

<div class="title">1，隐藏元素无法获取焦点</div>
<p>下面有个隐藏的Input:</p>
<p style="display: none;"><input class="input" id="textbox" name="textbox" value="Hi,CssRain!!!"></p>
<input onclick="process0();" value="无法使隐藏元素获取焦点" type="button">
<p>解决方法：先把元素显示，在获取焦点。</p>

<div class="title">2，对于div等特殊元素获取焦点</div>
<div id="a">我是DIV元素，我不带tabindex="-1"。</div>
<input onclick="process1();" value="Div不能获取焦点" type="button">
<div id="b" tabindex="-1">我是DIV元素，我带tabindex="-1",点击下面按钮试试效果。</div>
<input onclick="process2();" value="使Div获取焦点" type="button">
<script>
function process0(){
    var textbox = document.getElementById("textbox");
    textbox.onfocus = function(){alert('获取焦点');}
    textbox.focus();
}
function process1(){
    var a = document.getElementById("a");
    a.onfocus = function(){alert('获取焦点');}
    a.focus();
}
function process2(){
    var b = document.getElementById("b");
    b.onfocus = function(){alert('获取焦点');}
    b.focus();
    //非常推荐使用 tabindex = -1，基本无副作用！
}
 </script>