1、选中输入框（input、textarea等）中的文字

<form action="" name="form1"><input class="input" name="input1" type="text" value="我是input的内容" />
</form><script>var input = document.querySelector(".input");input.onclick = function () {if (document.form1.input1.focus) {document.form1.input1.select();}};
</script>

注意：form和input都要加上name属性，这样可以通过document.form1.input1直接得到input元素。

结果：点击input框会自动选中input框中的文字

2、普通标签（div、p、span等）

<div class="div">我是div中的元素</div><script>
var div = document.querySelector(".div");div.onclick = function () {var selection = window.getSelection();selection.removeAllRanges();var range = document.createRange();range.selectNodeContents(div.firstChild);selection.addRange(range);};
</script>

1、window.getSelection() 表示返回一个 Selection 对象，表示用户选择的文本范围或光标的当前位置。

2、selection.removeAllRanges(); 表示将所有的区域都从选区中移除。

3、document.createRange(); 表示返回一个 Range 对象。Range 接口表示一个包含节点与文本节点的一部分的文档片段。

4、range.selectNodeContents 表示使 Range 包含某个节点的内容。()中写需要选中的dom节点。

5、selection.addRange() 表示一个区域（Range）对象将被加入选区。

结果：点击div，其内容会被选中

JS鼠标点击自动选中点击元素中的文字相关推荐

js实现鼠标点击自动选中点击元素内的文字
最近需要在页面上实现一个点击元素(p.div等等)内文字,文字自动选中的效果,找了一圈最后终于实现了,现总结如下: 1.如果是要选中输入框(input.textarea)内的文字,代码如下: < ...
js鼠标略过自动选择当前行
js鼠标略过自动选择当前行效果图: 相关代码: <!DOCTYPE html> <html><head><meta charset="utf-8& ...
JS 鼠标单击，双击，三击，多击
如果用 <div ondblclick="f2()" onclick="f1()"></div> 那么双击,会先执行两次f1()后,再执 ...
js 进入一个页面自动执行触发点击事件
进入页面自动执行点击事件,跳转的有些快,注意看那一瞬间的变化! <!DOCTYPE html> <html lang="en"><head>&l ...
html倒计时自动点击,JS脚本实现网页自动秒杀点击
我们先来看下秒杀活动页面代码 Micomo 活动倒计时秒! //倒计时30秒 var i = 30; function remainTime() { if (i > 0) { document. ...
html 页面自动点击,JS脚本实现网页自动秒杀点击
我们先来看下秒杀活动页面代码 Micomo 活动倒计时秒! //倒计时30秒 var i = 30; function remainTime() { if (i > 0) { document. ...
HTML/CSS/JS 鼠标特效二（鼠标点击WEB页面出现彩色爱心冒泡特效）
1.实际效果 [青树柠檬~旧事老酒] 2.示例代码 /*--鼠标点击特效,不同颜色桃心图案*/ <script type="text/javascript">!func ...
点击编辑框全选内容java,js实现鼠标点击文本框自动选中内容的方法
本文实例讲述了js实现鼠标点击文本框自动选中内容的方法.分享给大家供大家参考.具体如下: 这里使用JS实现鼠标点击时自动选中文本框文本的效果,相信许多朋友都遇到这种功能的,就是当我们点击文本框的时候, ...
html 点击文本框则选中,JS事件内容选中事件（onselect）选中事件，当文本框或者文本域中的文字被选中时，触发onselect事件，同时调用的程序就会被执行。...
内容选中事件(onselect) 选中事件,当文本框或者文本域中的文字被选中时,触发onselect事件,同时调用的程序就会被执行. 如下代码,当选中用户文本框内的文字时,触发onselect 事件, ...

JS鼠标点击自动选中点击元素中的文字

目录

1、选中输入框（input、textarea等）中的文字

2、普通标签（div、p、span等）

JS鼠标点击自动选中点击元素中的文字相关推荐

最新文章

热门文章

JS鼠标点击自动选中点击元素中的文字

目录

1、 选中输入框（input、textarea等）中的文字

2、普通标签（div、p、span等）

JS鼠标点击自动选中点击元素中的文字相关推荐

最新文章

热门文章

1、选中输入框（input、textarea等）中的文字