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);

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

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

相关推荐
狗头大军之江苏分军2 分钟前
Ant Design 6.0 正式发布:从 V5 到 V6 有哪些变化?
前端
Highcharts.js6 分钟前
Highcharts Grid 表格/网格安装 |官方安装文档说明
开发语言·javascript·表格组件·highcharts·官方文档·安装说明·网格组件
优弧8 分钟前
Claude 终于对普通人下手了!Cowork 发布,你的最强 AI 打工搭子来了!
前端·后端
Zoey的笔记本31 分钟前
敏捷与稳定并行:Scrum看板+BPM工具选型指南
大数据·前端·数据库·python·低代码
文心快码BaiduComate33 分钟前
0代码手写!体验百度Comate的“魔法”:我造了个会理解情绪的中介层
前端·程序员·前端框架
zhengxianyi51540 分钟前
ruoyi-vue-pro优化——让菜单支持多个参数,一键直达【经营分析】、【生产报表】、【销售报表】
vue.js·前后端分离·数据大屏·ruoyi-vue-pro优化
38242782741 分钟前
表单提交验证:onsubmit与return详解
前端·javascript·html
前端小蜗42 分钟前
普通前端程序员的 2025:没什么大胜利,但也没被生活击倒
前端
bug总结1 小时前
身份证号脱敏的正确实现
前端·javascript·vue.js
林太白1 小时前
Vite8 Beta来了,Rolldown携手Oxc
前端·javascript·后端