如果已知一个文本框内输入值,想点击替换掉里面选中的值,可以采用以下方法;
其实就是获取到选中的开始结束为止,然后使用subString方法进行切割字符串即可
javascript
<template>
<div>
<el-input v-model="mobileText" ref="input"></el-input>
<el-button @click="replaceSelection">替换选中文字</el-button>
</div>
</template>
<script>
export default {
data() {
return {
mobileText: '这是一段示例文本。',
selectionStart: 0,
selectionEnd: 0,
};
},
methods: {
// 获取选中的文字的起始和结束位置
handleSelection() {
this.selectionStart = this.$refs.input.selectionStart;
this.selectionEnd = this.$refs.input.selectionEnd;
},
replaceSelection() {
// 获取选中的文字
const selectedText = this.mobileText.substring(this.selectionStart, this.selectionEnd);
// 替换选中的文字,这里以"新内容"为例
const newText = this.mobileText.substring(0, this.selectionStart) + "新内容" + this.mobileText.substring(this.selectionEnd);
// 更新数据模型中的文本
this.mobileText = newText;
}
}
}
</script>