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

 更新时间:2014年09月03日 15:30:30   投稿:whsnow  
这篇文章主要介绍了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()

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

相关文章

  • Highslide.js是一款基于js实现的网页中图片展示插件

    Highslide.js是一款基于js实现的网页中图片展示插件

    这篇文章主要介绍了Highslide.js是一款基于js实现的网页中图片预览查看工具,需要的朋友可以参考下
    2007-05-05
  • JS绘制生成花瓣效果的方法

    JS绘制生成花瓣效果的方法

    这篇文章主要介绍了JS绘制生成花瓣效果的方法,涉及javascript数学运算及页面元素操作的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-08-08
  • PixiJS学习之Sprite类的使用详解

    PixiJS学习之Sprite类的使用详解

    Sprite 直译为 “精灵”,是游戏开发中常见的术语,就是将一个角色的多个动作放到一个图片里,通过裁剪局部区域得到当前的角色状态图。本文主要介绍了PixiJS中Sprite类的使用,需要的可以参考一下
    2023-02-02
  • 微信小程序中时间戳和日期的相互转换问题

    微信小程序中时间戳和日期的相互转换问题

    这篇文章主要介绍了微信小程序中时间戳和日期的相互转换问题,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-07-07
  • JS hashMap实例详解

    JS hashMap实例详解

    这篇文章主要介绍了JS hashMap实例详解的相关资料,包括删除键值、获取键值的相关知识,非常不错具有参考借鉴价值,需要的朋友一起看看吧
    2016-05-05
  • JavaScript 中使用Promise.all()方法经验技巧详解

    JavaScript 中使用Promise.all()方法经验技巧详解

    这篇文章主要为大家介绍了JavaScript 中使用Promise.all()方法经验技巧详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-10-10
  • JS中的数组的sort方法使用示例

    JS中的数组的sort方法使用示例

    sort会调用每一项的toString方法进行比较,下面为大家介绍下JS中数组sort方法的具体使用
    2014-01-01
  • javascript中bind函数的作用实例介绍

    javascript中bind函数的作用实例介绍

    bind()的方法在ie,6,7,8中不适用,需要扩展通过扩展Function prototype可以实现此方法,下面为大家介绍下javascript中bind函数的作用
    2014-09-09
  • JavaScript实现2种常见的抽奖效果实例代码

    JavaScript实现2种常见的抽奖效果实例代码

    抽奖系统是一种常见的功能,可以用于各种活动和网站,这篇文章主要给大家介绍了关于JavaScript实现2种常见的抽奖效果的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-01-01
  • 一个不错的js html页面倒计时可精确到秒

    一个不错的js html页面倒计时可精确到秒

    这篇文章主要介绍了一个不错的js html页面倒计时可精确到秒,很简单,但和实用,需要的朋友可以参考下
    2014-10-10

最新评论