element.setSelectionRange()使用

最新推荐文章于 2024-05-29 15:51:40 发布

shengmeshi

最新推荐文章于 2024-05-29 15:51:40 发布

阅读量4k

点赞数

分类专栏： web前端文章标签： Range 文本选择

本文链接：https://blog.csdn.net/shengmeshi/article/details/76144172

版权

web前端专栏收录该内容

13 篇文章 0 订阅

订阅专栏

在做“页面中双击某段文字后可直接在页面上修改内容功能”时，遇到内容范围选择问题。

inputElement.setSelectionRange(selectionStart, selectionEnd, [optional] selectionDirection);

属性值	值
selectionStart	选择内容的第一个字符
selectionEnd	选择内容的最后一个字符位置+1，例如：选择至字符串下标为5的字符，selectionEnd=6
selectionDirection	forward、backward、none，三种选择方向，默认为forward从前向后

例如：

<input id="input01" type="text" value="测试文字测试文字" onfocus="getFocus(this)">

function getFocus(that){
   that.setSelectionRange(0,that.value.length);
}

结果：
这里写图片描述

在查找相关内容的时候，发现有个概念Range,查了一些相关介绍，内容还是很多的，记录下地址，方便以后学习

来自张鑫旭-鑫空间-鑫生活
http://www.zhangxinxu.com/wordpress/2011/04/js-range-html%E6%96%87%E6%A1%A3%E6%96%87%E5%AD%97%E5%86%85%E5%AE%B9%E9%80%89%E4%B8%AD%E3%80%81%E5%BA%93%E5%8F%8A%E5%BA%94%E7%94%A8%E4%BB%8B%E7%BB%8D/