uniapp中textarea读取光标
时间: 2023-08-09 07:04:23 浏览: 153
用javascript获取textarea中的光标位置
5星 · 资源好评率100%
在uniapp中,可以通过使用textarea组件的`selection-start`和`selection-end`属性来读取光标的位置。这两个属性分别表示选中文本的起始位置和结束位置,如果没有选中文本则两个属性值相等,即表示光标的位置。
以下是一个示例代码:
```html
<template>
<textarea
ref="textarea"
v-model="text"
@input="onInput"
@click="onClick"
></textarea>
</template>
<script>
export default {
data() {
return {
text: '',
cursorPosition: 0
}
},
methods: {
onInput(e) {
this.text = e.target.value
},
onClick(e) {
this.cursorPosition = e.target.selectionStart
console.log('光标位置:', this.cursorPosition)
}
}
}
</script>
```
在上面的代码中,`textarea`组件绑定了`text`变量,同时监听`input`事件来更新`text`变量的值。在`click`事件中,可以通过`e.target.selectionStart`来获取光标的位置,并将其保存在`cursorPosition`变量中。
阅读全文