ElementUI input输入框实现选择部分内容
程序员文章站
2022-03-22 09:51:35
项目中有个文档管理模块,重命名功能是需要选中文件名,文件后缀不能被选中。ElementUI有提供全选的方法,如果选择所有内容可直接使用该方法。如图:如果要实现选择部分内容就不能直接使用该方法。实际input给我们提供了selectionStart,selectionEnd两个属性表示选择内容的起始位置。还有一个问题就是ElementUI提供给我们的输入框实际结构是这样的这样下来问题就简单了。上代码:```javascript// Name表示文件全名(包括后缀名),Suffix代表后缀名l...
项目中有个文档管理模块,重命名功能是需要选中文件名,文件后缀不能被选中。
ElementUI有提供全选的方法,如果选择所有内容可直接使用该方法。如图:
如果要实现选择部分内容就不能直接使用该方法。实际input给我们提供了selectionStart,selectionEnd两个属性表示选择内容的起始位置。还有一个问题就是ElementUI提供给我们的输入框实际结构是这样的
这样下来问题就简单了。上代码:
// Name表示文件全名(包括后缀名),Suffix代表后缀名
let el = this.$refs.editInput.$el.children[0]; // 获取到input对象
el.select() // 选择
el.selectionEnd = row.Name.indexOf(row.Suffix);// 选择末尾位置
本文地址:https://blog.csdn.net/weixin_45016896/article/details/111880858
上一篇: bat与注册表操作的方法分析 原创
下一篇: 常用正则表达式与批注[收藏]
推荐阅读
-
php实现input输入框失去焦点自动保存输入框的数据
-
纯CSS3实现漂亮的input输入框动画样式库(Text input love)
-
jQuery实现动态添加、删除按钮及input输入框的方法
-
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
-
纯CSS3实现漂亮的input输入框动画样式库(Text input love)
-
javascritp实现input输入框相关限制用法
-
jquery实现input输入框实时输入触发事件代码
-
JS实现的input选择图片本地预览功能示例
-
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
-
css3实现input输入框颜色渐变发光效果代码