js学习笔记24----焦点事件
Posted 前端[色色]
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js学习笔记24----焦点事件相关的知识，希望对你有一定的参考价值。
事件：
onfous : 元素获取焦点时触发事件
onblur : 元素失去焦点时触发事件
方法：
obj.focus(); 可指定元素设置焦点
obj.blur(); 取消指定元素的焦点
obj.select(); 选中指定元素里面的文本内容
示例代码：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <title>焦点事件</title> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <script> 8 window.onload = function(){ 9 var oIpt = document.getElementById("test"); 10 oIpt.focus();//自动获取焦点 11 oIpt.select();//自动选中文本框里面的内容 12 13 oIpt.onfocus = function(){ 14 if(this.value == "请输入内容"){ 15 this.value = ""; 16 } 17 } 18 oIpt.onblur = function(){ 19 if(this.value == ""){ 20 this.value = "请输入内容"; 21 } 22 } 23 } 24 </script> 25 </head> 26 <body> 27 <input type="text" name="test" value="请输入内容" id="test"> 28 </body> 29 </html>
以上是关于js学习笔记24----焦点事件的主要内容，如果未能解决你的问题，请参考以下文章
jquery失去焦点与获取焦点事件blur() focus()
JavaScript笔记--- ECMAScript(续) (JS事件；JS代码的执行顺序；设置节点属性；捕捉回车键；void 运算符；JS中的控制语句)