Js 获取表单高亮选中的内容 和 设置文本选中内容

一、获取鼠标当前高亮选中的内容

这里的 el 为 获取到的表单元素

javascript 复制代码
//获取选中开始下标
let startIndex = el.selectionStart;
//获取选中结束下标
let endIndex = el.selectionEnd;
//获取表单选中内容
let selectedString = el.value.slice(startIndex,endIndex);

console.log(selectedString)

selectionStart: 当前选中的开始下标
selectionEnd: 当前选中的结束下标

如果没有文本被选中时, selectionStart 和 selectionEnd 的值是一样的,都为当前焦点的下标位置

二、设置表单文本内容选中

setSelectionRange(选中的开始下标,选中的结束下标)

javascript 复制代码
el.focus();
el.setSelectionRange(0,1);

上面代码将高亮选中第一个字符

如果设置的 开始下标 和 结束下标 一样时,会把当前输入焦点定位到指定的位置

相关推荐
lzhdim4 分钟前
CSS实现毛玻璃模糊效果
前端·css
We་ct5 分钟前
浏览器渲染流程(完整+面试背诵版)
前端·面试·职场和发展·edge·edge浏览器
2301_805962935 分钟前
从零开始写第一个网页——HTML结构入门教程(小白友好)
前端·html
iambooo17 分钟前
Bash 执行机制与进程模型:理解 Shell 的底层逻辑
前端·chrome
a11177619 分钟前
个人展示页面(html 线条交互)
前端·开源·html
笨蛋不要掉眼泪19 分钟前
Spring Cloud Gateway 核心实战:断言(Predicate)的长短写法与自定义工厂详解
java·前端·微服务·架构
RichardLau_Cx22 分钟前
零依赖!纯前端 AI 辅助病例管理系统 aiCaseManage:无后端也能实现诊疗行为核验
前端·人工智能·前端开发·localstorage·医疗科技·ai辅助开发·零依赖项目
Never_Satisfied40 分钟前
在HTML & CSS中,CSS选中第二个指定类型的子元素的方法
前端·css·html
木斯佳42 分钟前
前端八股文面经大全:字节跳动前端一面(2025-10-09)·面经深度解析
前端·状态模式
Never_Satisfied44 分钟前
在HTML & CSS中,图片嵌入文字方法
前端·css·html