javascript - 正则表达式查找字符串的所有出现然后查找它之后的下一个空格

Question

$("#idofreplybox").on('keyup, keydown',function(){
    var e = $(this).html();
    if (e.indexOf(@) !== -1){}else{
        var d = find all occurences of @
        var f = find the next whitespace after that @
        change the text between var d and var f to blue
    }
});

使用此代码，当有人键入 时@steve，他们的名字应该变成蓝色。但是我不确定我需要将代码块中的文本更改为 javascript 代码的正则表达式。

对不起，如果这对你来说很明显，但我是一个正则表达式菜鸟，所以我无法弄清楚我需要写什么。

任何帮助，将不胜感激。

Answer 1

使用@dystroy 的正则表达式：

    (function($){
$("#idofreplybox").keyup(function(){
    var e = $(this).html();

    if (e.length && /@(\w+)\b/.test(e)){
        e = e.replace(/@(\w+)\b/g, '<span style="color: blue;">$1</span>');
        $(this).html(e);
    } else {

    }
});}
)(jQuery);

但请注意，您不能在文本框中使用 html，不能使用内容可编辑元素或代理/虚拟对象，它们将充当文本框并将内容/html 复制到 div。

工作小提琴

$1 是指第一个括号 () 匹配，$2 是第二个，依此类推

Answer 2

用于\b单词边界。

例如 ：

"test @username bla bla".replace(/@(\w+)\b/g, "<span class=user>$1</span>")

给

"test <span class=user>username</span> bla bla"