日期:2014-05-16  浏览次数:20309 次

想做个按键切换焦点的JS 怎么弄?
三个输入框:
姓名<input type='text' name='txt1'><br />
手机<input type='text' name='txt2'><br />
昵称<input type='text' name='txt3'><br />
<button id='btn1'>下一个</button>
按钮描述:没有input获得焦点时,点击按钮第一个input获得焦点,有input获得焦点时,点击按钮下一个input获得焦点。
这个要怎么弄呢?当有INPUT获得焦点 当前INPUT的下一个元素呢?当按钮onclick被触发时,此时的focus是#documnet了,而不是input了?是不是?
要怎么做呢?

------解决方案--------------------
HTML code

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
        <style>
        
        </style>
    </head>
    <body>
        姓名<input type='text' name='txt1'><br />
        手机<input type='text' name='txt2'><br />
        昵称<input type='text' name='txt3'><br />
        <button id='btn1'>下一个</button>
        <script>
            var $ = function(id){
                return document.getElementById(id);
            };
            var $t = function(tag, cot){
                cot = cot || document;
                return cot.getElementsByTagName(tag);
            };
            
            var objs = $t('input');
            var i = 0;
            $('btn1').onclick = function(){
                objs[i].focus();
                i = i > 1 ? 0 : i + 1;
            }
            
            
        </script>
    </body>
</html>

------解决方案--------------------
sorry 刚才的tab影响拍板 这次换成空格就好了
<html>
<head>
<script>
function xyz() {
var inputs1 = document.getElementsByTagName("input");
for (var i = 0; i < inputs1.length; i ++) {
if (inputs1[i].inputing == "true") {
inputs1[i].inputing = "false";
inputs1[(i + 1) % inputs1.length].focus();
return;
}
}
if (inputs1[0]) {
inputs1[0].inputing = "false";
inputs1[0].focus();
}
}
function initInputing(inputObject) {
var inputs2 = document.getElementsByTagName("input");
for (var i = 0; i < inputs2.length; i ++) {
if (inputs2[i] == inputObject) {
inputs2[i].inputing = "true";
}
else {
inputs2[i].inputing = "false";
}
}
}
</script>
</head>
<body>
<center>
姓名<input type="text" name="txt1" inputing = "false" onfocus = "initInputing(this)"><br/>
手机<input type="text" name="txt2" inputing = "false" onfocus = "initInputing(this)"><br/>
昵称<input type="text" name="txt3" inputing = "false" onfocus = "initInputing(this)"><br/>
<button id="btn1" onclick = "xyz()">下一个</button>
</center>
</body>
</html>