javascript - 检测按键上的字符

Question

假设在文本输入字段中，我正在输入一个句子。然后我输入某个字符，例如“@”，如下所示:

I am writing this example with @ symbol.

使用按键，当使用该符号时，我想检查它之前和之后的字符。

在这种情况下，它将给出两个空格。

另一个例子是:

This is another example using @text.

这里应该给出一个空格作为符号“之前”和“t”作为符号“之后”。

满足按键条件时如何检测这些字符？

任何建议将不胜感激。

Answer 1

使用input event与输入元素上的 selectionStart 属性结合使用，它允许您获取光标的位置。

document.getElementById('example').addEventListener('input', function () {
    var text = this.value,
        cursor = this.selectionStart
    
    // the characters in question
    var previous = text.charAt(cursor - 2),
        current  = text.charAt(cursor - 1),
        next     = text.charAt(cursor)
    
    // do something cool
    console.log(previous, '|', current, '|', next)
})

<input type="text" id="example" value="edit this example text :)"/>