javascript - 获取@和文本区域当前位置之间的出现次数

Question

我想得到 @ 之后的单词取决于 textarea 的当前写入位置。更准确地说:

• 如果当前光标位置在 @<user> 的任意字母上，答案应该是<user>

• 如果当前光标位置在任何其他单词上，则答案应为空 ''

我正在努力解决这个问题，但没有找到任何“好的”方法。

$('#hey').on('click', function() { alert(); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<textarea id="chat">hello @user it's me this is a long text, here is another @username cheers!</textarea>
<span id="hey">CLICK ME</span>

Answer 1

更新了假定重复的代码 Get current word on caret position ，结果如下

function getCaretPosition(ctrl) {
    var start, end;
    if (ctrl.setSelectionRange) {
        start = ctrl.selectionStart;
        end = ctrl.selectionEnd;
    } else if (document.selection && document.selection.createRange) {
        var range = document.selection.createRange();
        start = 0 - range.duplicate().moveStart('character', -100000);
        end = start + range.text.length;
    }
    return {
        start: start,
        end: end
    }
}

$("textarea").on("click keyup", function () {
    var caret = getCaretPosition(this);
    var endPos = this.value.indexOf(' ',caret.end);
    if (endPos ==-1) endPos = this.value.length;
    var result = /\S+$/.exec(this.value.slice(0, endPos));
    var lastWord = result ? result[0] : null;
    if (lastWord) lastWord = lastWord.replace(/['";:,.\/?\\-]$/, ''); // remove punctuation
    $("#atID").html((lastWord && lastWord.indexOf("@") == 0)?lastWord:"");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<textarea>Follow me on twitter @mplungjan if you want</textarea><br/>
<span id="atID"></span>