输入框中实现tab键输入

最新推荐文章于 2024-10-09 00:58:21 发布

薄荷味的凉茶

最新推荐文章于 2024-10-09 00:58:21 发布

阅读量210

点赞数 3

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_49782492/article/details/141023186

版权

<q-input
  v-model="text"
  outlined
  type="input"
  @keydown="handleInputEnter($event)"
/>

const handleInputEnter =(event)=>{
  if (event.key === 'Tab') {
    event.preventDefault(); // 阻止默认行为
    const start = event.target.selectionStart;// 获取光标开始位置
    const end = event.target.selectionEnd; // 获取光标结束位置
    const tab = '\t'; // 获取Tab转义字符
    const before = event.target.value.substring(0, start); // 获取光标前的字符串
    const after = event.target.value.substring(end); // 获取光标后的字符串

    event.target.value = before + tab + after; 
    // 更新光标位置
    event.target.selectionStart = start + tab.length;
    event.target.selectionEnd = start + tab.length;
  }
}