【focus】JavaScript使用focus()设置焦点失败的解决方法-设置焦点

欢迎您访问我爱IT技术网，今天小编为你分享的javascript教程：【JavaScript使用focus()设置焦点失败的解决方法】，下面是详细的讲解！

JavaScript使用focus()设置焦点失败的解决方法

昨天修改机顶盒上面的EPG页面，遇到一个小问题。用户购买游戏时需要弹出购买确认对话框，对话框的默认焦点规定必须停留在“取消”按键上。很简单的需求，使用JavaScript的focus()方法就可以实现了。简单的代码示例如下：

document.getElementById("cancel").focus()

但是苦逼的是，机顶盒真是一个大坑。由于要兼容所有现存的机顶盒型号，需要对8款机顶盒进行适配。然后就出现问题了！一款中兴B600的机顶盒完全没法将焦点设置到取消按键上。以下是我的解决思路：

首先确认该机顶盒是否支持getElementById()方法以及是否成功获得了ID为“cancel”的元素：测试方法很简单，直接另写了一个 <p id="test">test</p> ，然后在同样的地方获取ID为“test”的元素，并进行了简单的操作document.getElementById("test").innerHTML="Hello"
最后使用了“try...catch(e)...”捕捉“focus()”失败的原因

try(){ 
<span style="white-space:pre"> </span>document.getElementById("cancel").focus() 
}catch(e){ 
<span style="white-space:pre"> </span>alert(e.name + ": " + e.what()); 
}

但是就是很奇怪！以上两步的结果表明该机顶盒支持focus()和getElementById()，但是就是无法设置焦点到弹出的对话框中。

前前后后折腾了一个多小时，最后大BOSS出现了，就简单说了一句话就解决了这个问题！有可能要主动调用flur()将原来的焦点取消掉！

document.getElementById("purchase").flur()

然后就解决了这个问题。不得不感概！在解决这个问题的过程中，自己的思路其实还是蛮正确的，但知识面显然不够。一般程序员和高级程序员的差距除了解决问题的思路方面，也有经验和知识面的差距！

关于JavaScript使用focus()设置焦点失败的解决方法的用户互动如下：

　　相关问题：javascript中focus函数问题

　　答：myform 是 >>详细

　　相关问题：JS，关于focus()定位焦点的问题。

　　答：document.getElementById('abc').focus(); //让abc获取焦点 var input = document.getElementById( "abc" ); var val = input.value; //将abc的值位置给val input.value = "";//将abc的值设置为空 input.value = val;//重新给abc赋值（将保存在v... >>详细

　　相关问题：Javascript，focus()函数不能使输入框获得焦点

　　答：你可以看看这个，也许能帮助你明白为什么你原来的方法不行，但是用另一种方法就可以。http://hi.baidu.com/xizhilang6688/blog/item/9ca1c4fe34899d3d5d600869.html 当你使用innerHTML的时候dom 会重绘，重绘意味着那些focus全部不起作用。 至于... >>详细