您好,欢迎访问一九零五行业门户网

JavaScript如何获取焦点和失去焦点

本篇文章给大家介绍一下javascript获取焦点和失去焦点的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。
焦点处理焦点处理主要包括focus(获取焦点)和blur(失去焦点)事件类型。所谓焦点,就是激活表单字段,使其可以响应键盘事件。
获取焦点:focus当单击或使用tab键切换到某个表单元素或超链接对象时,会触发该事件。focus事件是确定页面内鼠标当前定位的一种方式。在默认情况下,整个文档处于焦点状态,但是单击或者使用tab键可以改变焦点位置。‘
示例:在页面加载完毕后,将焦点转移到表单中的第一个文本框字段,让其准备接收用户输入
<form id="myform" method="post" action="#"> 姓名<input type="text" name="name"/><br> 密码<input type="password" name="pass" /></form><script> var form = document.getelementbyid("myform"); var field = form.elements("name"); window.onload = function(){ field.focus(); }</scriipt>
失去焦点:blurblur事件类型表示在元素失去焦点时响应,它与focus事件类型是对应的,主要作用于表单元素和超链接对象
示例:为所有输入表单元素绑定了focus和blur事件处理函数,设置当元素获取焦点时呈凸起,失去焦点呈凹陷
<!doctype html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <input type="text" /> <input type="text" /> <script> var o = document.getelementsbytagname("input"); for(var i = 0; i < o.length; i++){ o[i].onfocus = function(){ this.style.borderstyle = "outset"; } o[i].blur = function(){ this.style.borderstyle = "inset"; } } </script> </body></html>
注意:如果时隐藏字段(c3138f6d64120e606b262ed3642d2c5c),或者使用css的display和visibility隐藏字段显示,设置其获取焦点将引发异常。
【推荐学习:javascript高级教程】
以上就是javascript如何获取焦点和失去焦点的详细内容。
其它类似信息

推荐信息