JS--JavaScript焦点处理（获取焦点focus、失去焦点blur）_js focus_吴声子夜歌的博客

获取焦点：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>
失去焦点：blur
 
blur事件类型表示在元素失去焦点时响应，它与focus事件类型是对应的，主要作用于表单元素和超链接对象 
示例：为所有输入表单元素绑定了focus和blur事件处理函数，设置当元素获取焦点时呈凸起，失去焦点呈凹陷 
<!DOCTYPE html>
		<meta charset="UTF-8">
		<title></title>
	</head>
		<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>
注意：如果时隐藏字段（< input type=“hidden” >），或者使用CSS的display和visibility隐藏字段显示，设置其获取焦点将引发异常。
                                    对于良好的用户体验来说,网站/web app的可访问性和可用性,以及功能 都是至关重要的。 当我们的网站运行良好/体验很好的时候,用户是意识不到的,但我们做得不好时他们肯定会感觉到。 应用程序的可用性和可访问性的一个重要组成部分是输入焦点(focus)的处理,但这又是开发人员常常会忽视的一点。 对输入焦点处理很差的一个例子: 在点击一个链接以后打开一个窗口,但却不将光标聚焦到窗口中的任何元素内。 甚至更糟的是: 聚焦到模态窗口中的某个元素,但在关闭以后焦点照样不返回。 理想情况下,在触发链接时会保存一个引用,然后将光标聚焦到新窗口,并在窗口关闭时把光标重新移回去。 但假如你不知道输入光标现在在
                                    什么是焦点事件
焦点：使浏览器能够区分用户输入的对象，当一个元素有焦点的时候，那么他就可以接收用户的输入只有能够响应用户操作额元素才可以接收焦点事件，比如：a button input...
onfocus：当元素获取到焦点的时候触发
odiv.onfocus = funcion(){}
onblur:当元素失去焦点的时候
obj.foc...
                                    常常会在回复和引用里使用此功能，即单击回复或引用，如让输入焦点出现在留言输入框中，如果使用锚来定位，输入焦点就不能激活了。 
javascript:document.getElementById("id").focus(); 
或javascript:document.all.id.focus(); 
或javascript:document.all.name.focus(); 
                                    JavaScript是一种脚本语言，缩写为JSHTML是主体。CSS是用来修饰HIML的。JS是用来操作HTML和CSS的,修改HTML中的元素,修改CSS样式,达到网页的动态效果。
获取焦点：focus
当单击或使用Tab键切换到某个表单元素或超链接对象时，会触发该事件。focus事件是确定页面内鼠标当前定位的一种方式。在默认情况下，整个文档处于焦点状态，但是单击或者使用Tab键可以改变焦点位置。‘
示例：在页
                                    获取焦点(onFocus)：鼠标进入input框触发
失去焦点（onBlur）：鼠标离开input框触发
  <input type="text" onblur="getBlur()" onfocus="getFocus()">
  <script type="text/javascript">
    function getBlur() {
      alert("失去焦点")
    function getFocus() {
      alert("获取焦点"
                                    js焦点处理的几种方式,表单焦点处理和容器焦点处理，常用于文本框获取焦点时调用函数和失去时调用函数，div点击弹出层，当失去焦点时候隐藏层等问题处理。javascript焦点处理，很好的解决了此类问题。...
                                    1.获取ID的函数在说获取焦点和失去焦点事件之前，先说说封装获取ID的函数。一般在实际操作中，会经常用到提取某个元素的ID，如果每条都列，想必非常麻烦。一般如果有很多ID需要提取的情况基本都用提取ID的函数。 
获取ID的函数如下：   function $(id) {
//    $符号一般用作获取id的函数名，有时候也有人用$id作为函数名。在这里我们只需要获取一个变量。
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-U