用Javascript中的字符串突出顯示我的「@用戶名」

Question

我想突出顯示用戶在用戶名@login等字符串中檢測到的用戶名。下面是這似乎不工作代碼：

function parse(string) { 
    var regex = new RegExp('(\W|^)@('+username+')(\W|$)', 'i'); 
    return String(string).replace(regex, '<span class="label radius">@$2</span>'); 
} 

而且這裏有一個的jsfiddle進行測試：http://jsfiddle.net/2pmLT/3/

當我型我@login，它凸顯，但只有當它是唯一的文字中字符串：「@login哈哈」不起作用。

Answer 1

您需要逃避你的反斜槓。此外，您還應該添加$ 1和$ 3，否則您會刪除空格。使用G-標誌多取代

http://jsfiddle.net/7h8Aq/

function parse(string) { 
    var regex = new RegExp('(\\W|^)@('+username+')(\\W|$)', 'ig'); 
    return string.replace(regex, '$1<span class="label radius">@$2</span>$3'); 
} 

Answer 2

Here你去，你只需要更換某些情況下，所以沒有倪整個字符串匹配，還需要指定全局g標誌的正則表達式：

function parse(text) { 
    return text.replace(new RegExp('(@' + username + ')', 'g'), 
     '<span class="label radius">$1</span>'); 
} 

Answer 3

考慮this example實例。

HTML

<div id="test-block"> 
    <div class='label'></div> 
</div> 

JQuery的

$('#test').on('keyup', function(e) { 
    $('.label').text(parse($(this).val())); 
}); 

function parse(myString) { 
    var find = "(\W|^)@(" + username + ")(\W|$)"; 
    var regex = new RegExp(find, 'i'); 
    return myString.replace(regex, '@$2'); 
}