JS 实现鼠标 hover 时自动全选文本

在开发 web 页面过程中有时需要当鼠标 hover 时自动选中文本，特别是当代码块里是可以运行的命令行；下面介绍一个通过 JS 实现这个功能的方法。

具体的实现原理不用自己写，因为 javascript 已经封装了实现这个功能的方法 select()，我们只要正确调用就行。

原生 JS 实现：

<input id="a" type="text" value="鼠标移动到这里自动选中我" onmouseover="selectInputContent(this.id)"/>

<script type="text/javascript">
function selectInputContent(n){
  obj =document.getElementById(n);
  obj.focus();
  obj.select();
}
</script>

jQuery 实现：

<ul class="installDBRJS">
   <li title="Press Ctrl + C to copy the selected code"><input type="text" value="npm install dynamsoft-javascript-barcode"/></li>
   <li title="Press Ctrl + C to copy the selected code"><input type="text" value="bower install dbr"/></li>
   <li title="Press Ctrl + C to copy the selected code"><input type="text" value="meteor add dynamsoft:dbr"/></li>
   <li title="Press Ctrl + C to copy the selected code"><input type="text" value="composer require dynamsoft/barcode"/></li>
</ul>

<script type="text/javascript">
$(document).ready(function(){
  $("#dbrJsCode .installDBRJS li input").mouseover(function(){
    $(this).select();
  })
})
</script>

[鼠标移动到文本框上，实现自动选中内容，方便复制](https://www.douban.com/note/576792818/?from=tag)

鼠标放在字上面就可以全选是用什么实现的

赏

谢谢你请我吃糖果

支付宝

微信

• 本文作者： Alvin
• 本文链接： https://alvinyw.github.io/2018/12/2/
• 版权声明： 本博客所有文章除特别声明外，均采用 MIT 许可协议。转载请注明出处！