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

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

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

相关推荐
J***Q29211 小时前
Vue数据可视化
前端·vue.js·信息可视化
JIngJaneIL11 小时前
社区互助|社区交易|基于springboot+vue的社区互助交易系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·社区互助
ttod_qzstudio12 小时前
深入理解 Vue 3 的 h 函数:构建动态 UI 的利器
前端·vue.js
芳草萋萋鹦鹉洲哦12 小时前
【elemen/js】阻塞UI线程导致的开关卡顿如何优化
开发语言·javascript·ui
_大龄13 小时前
前端解析excel
前端·excel
1***s63213 小时前
Vue图像处理开发
javascript·vue.js·ecmascript
一 乐13 小时前
应急知识学习|基于springboot+vue的应急知识学习系统(源码+数据库+文档)
数据库·vue.js·spring boot
槁***耿13 小时前
JavaScript在Node.js中的事件发射器
开发语言·javascript·node.js
一叶茶13 小时前
移动端平板打开的三种模式。
前端·javascript
前端大卫13 小时前
一文搞懂 Webpack 分包:async、initial 与 all 的区别【附源码】
前端