gpt4 book ai didi

javascript - 在文本区域或 contenteditable div 中键入 TAB 时检测最后写入的单词

转载 作者:行者123 更新时间:2023-12-03 01:41:58 25 4
gpt4 key购买 nike

textarea 中按下 TAB 时如何检测并选择最后写入的单词或内容可编辑div

我开始使用最后写入的字符或按键的缓冲区来完成此操作,但后来我注意到存在多个极端情况:

  • 假设用户写入HELLU退格键O

  • 用户使用箭头键移动

  • 用户可以使用 SPACE 分隔单词(这就是我使用的),也可以使用 ENTER 或逗号等分隔单词。

有没有一种好方法来检测最后写入的单词?

目标:编写自动完成功能的代码,例如:thx + <TAB> => 文本被替换为“非常感谢。”

最佳答案

您可以使用当前光标位置来检测最后一个单词。下面给出一个简单的例子。

document.getElementById('foobar').addEventListener('keydown', e => {
if( e.which == 9 ) {
e.preventDefault();
let endingIndex = e.target.selectionStart;
let startingIndex = endingIndex && endingIndex - 1;
let value = e.target.value;
// putt all delemeters in it by which word can be splitted
let regex = /[ ]/;

while(startingIndex > -1){
if(regex.test(value[startingIndex])){
++startingIndex;
break;
}
--startingIndex;
}

// note you will have you apply check to avoid negative index
if(startingIndex < 0) {
startingIndex = 0;
}
console.log(value.substring(startingIndex, endingIndex));

let newText = "replaced";
value = value.substring(0, startingIndex) + newText + value.substring(endingIndex);
let cursorPosition = startingIndex + newText.length;
e.target.value = value;
e.target.setSelectionRange(cursorPosition, cursorPosition);
}

});
<textarea id="foobar"></textarea>

关于javascript - 在文本区域或 contenteditable div 中键入 TAB 时检测最后写入的单词,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50794324/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com