JavaScript显示文本框后自动获取焦点

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

废话少说，见官方文档：

他的用法是：document.getElementById('username').focus(); 这样写在display:block;显示之后就可以自动激活input输入框啦！

这并不是最有意思的地方，最有意思的地方是他可以触发该元素的相应事件；

接下来来举个栗子：

<body> <input type="text" id="name"/> <button id="btn">点击获取焦点</button></body><script type="text/javascript"> document.getElementById('btn').onclick = function(){ document.getElementById('name').focus(); }; document.getElementById('name').onfocus = function(){ alert(1); };</script>

当然这个有趣的地方显得卵用不是很大，希望这个细节能给你解决问题的方法

另外一个就是select()方法：该方法是选中该区域的内容，在点击按钮进行复制文本的时候常用到

既然说到点击选中复制，附送一份点击实现Ctrl+c的功能函数

function copyXq(id){ //选中文字 document.getElementById(id).select(); //创建range对象，代表页面上一段连续的区域 const range = document.createRange(); //selectNode ：选择整个节点，包括子节点 //selectNodeContents:选择节点的子节点 range.selectNode(document.getElementById(id)); //window.getSelection()方法获取鼠标划取部分的起始位置和结束位置 const selection = window.getSelection(); //rangeCount方法返回选区(selection)中range对象数量的只读属性 if(selection.rangeCount > 0) selection.removeAllRanges(); //老子翻译不出来了，这B怎么有那么多方法 selection.addRange(range); document.execCommand('copy'); alert("复制成功！");};

该随笔主要是因为，萌新在刚开始走前端的时候一些细节会难以处理，所以记下的该笔记，那么，前路昭然，你我共进。