javascript hasFocus使用实例

 更新时间:2010年06月29日 00:12:19   作者:  
hasFocus是document的特有方法.用来判断当前网页是否获得焦点.
如果网页处于焦点状态返回true,否则返回fasle
什么是焦点?焦点是指用户是否活动在该页面.确切的说鼠标是否在该网页内活动.或者说该网页中的内容是否有被选中的,或者光标存在于该页的某个元素内.如果具备其中一个条件那么该页就处于焦点状态.注意hasFocus方法只针对网页不针对浏览器.下面的实例中.你用鼠标点击网页时候.该网页处于焦点状态.你用鼠标点击浏览器的地址栏以后.该网页失去焦点并显示false. 再次提醒hasFocus方法只能运行在document对像.请看下面实例
复制代码 代码如下:

<html>
<head>
<title>Dom:hasFocus方法实例</title>
</head>
<body onfocus="getFocus()" onblur="Empty_Focus()">
<h2>请点击网页区域.表明该网页获得焦点,显示为true.点击浏览器地址栏.该网页失去焦点显示为false</h2>
<hr/>
<a href="https://www.jb51.net" onfocus="getFocus()">脚本之家</a>
<span id="c"></span>
<script language="javascript">
function getFocus(){
document.getElementById("c").innerHTML = document.hasFocus();
}
function Empty_Focus(){
document.getElementById("c").innerHTML = document.hasFocus();
}
</script>
</body>
</html>

相关文章

  • js实现弹窗居中的简单实例

    js实现弹窗居中的简单实例

    下面小编就为大家带来一篇js实现弹窗居中的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • WebRTC媒体权限申请getUserMedia实例详解

    WebRTC媒体权限申请getUserMedia实例详解

    这篇文章主要为大家介绍了WebRTC媒体权限申请getUserMedia实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-11-11
  • Webpack执行命令参数详解

    Webpack执行命令参数详解

    本篇文章主要介绍了Webpack执行命令参数详解 ,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • window.print打印指定div实例代码

    window.print打印指定div实例代码

    window.print可以打印网页,但有时候我们只希望打印特定控件或内容,怎么办呢,请看下面的例子
    2013-12-12
  • bootstrap datepicker插件默认英文修改为中文

    bootstrap datepicker插件默认英文修改为中文

    这篇文章主要为大家详细介绍了bootstrap datepicker插件默认英文修改为中文的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 微信小程序开发中生命周期的详细介绍

    微信小程序开发中生命周期的详细介绍

    生命周期是指一个对象从创建→>运行>销毁的整个阶段,强调的是一个时间段,文中介绍了小程序中组件的生命周期,需要的朋友可以参考下
    2023-03-03
  • JavaScript使用箭头函数实现优化代码

    JavaScript使用箭头函数实现优化代码

    在JavaScript的编程世界里,我们时常被普通函数的冗长写法所困扰,每次都需要写function关键字,有时候还要明确地写return语句,下面我们就来看看如何利用箭头函数优化这些繁琐的代码吧
    2023-11-11
  • js 右键菜单,支持不同对象不同菜单(兼容IE、Firefox)

    js 右键菜单,支持不同对象不同菜单(兼容IE、Firefox)

    版本虽然很老也不符合标准了,不过代码是值得参考的,需要右键菜单的朋友可以参考下。
    2010-01-01
  • 微信小程序实现原生步骤条

    微信小程序实现原生步骤条

    这篇文章主要为大家详细介绍了微信小程序实现原生步骤条,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-07-07
  • Eval and new funciton not the same thing

    Eval and new funciton not the 

    以前有人会说,new Function的方式是几乎与eval相等,今天我查了一下,确实是不同的东西,说这句话的人太不负责了。关于eval和new function,得到的结果都是一致的,都会叫你不要去使用它们。所以结论就是“不得不”才使用
    2012-12-12

最新评论