在評論中鏈接用戶

我想在評論中鏈接用戶。到目前爲止，我已經完成了後端（在Django），現在我正在爲前端掙扎。我設法使用JavaScript編寫一些內容，以便在評論的名稱前面帶有字符「@」時使用戶名可點擊。在評論中鏈接用戶

function urlify(texts) { 
    var urlRegex = /(@[^\s]+)/g; 
    return texts.replace(urlRegex, function(url) { 
     return '<a href="/profiles/' + url.substr(1) + '/">' + url + '</a>'; 
    }) 
} 

var texts = $(".content1").text(); 

var html = urlify(texts); 

$('.test1').prepend(html); 
$('.content1').prepend(html);

現在我可以得到第一條評論，並使用戶名可點擊。

如何重寫代碼以便每個註釋都被替換？我想過一個for循環，但我不知道如何編寫它。有一種簡單的方法，我可以用一個函數替換模板上的所有「@」？

來源

2017-05-04 Marla

哪裏有意見嗎？很難說什麼來循環，因爲你沒有顯示任何HTML例子。 –

['$（'.comment'）.each（function）']（http://api.jquery.com/each/）??沒有關於您正在使用的DOM結構的一些想法，很難說任何有用的東西。 –

評論與類「content1」一起保存。 Phix提出了一個工作解決方案，但感謝提示.each（函數）將在下次嘗試。 – Marla

var string = 'Hey @user123, can you upload a file'; 
function urlify(texts) { 
    var urlRegex = /(@[\w]+)/g; 
    return string.replace(urlRegex, function(match){ 
    var name = match.slice(1); 
    return '<a href="https://stackoverflow.com/users/profiles/' + name + '">' + match + '</a>' 
    }) 
} 

console.log(urlify(string));

返回Hey <a href="https://stackoverflow.com/users/profiles/user123">@user123</a>, can you upload a file

編輯多個：

使用字符串嘿@ user123，你可以上傳文件，否則@admin可你看看

產量：

Hey <a href="https://stackoverflow.com/users/profiles/user123">@user123</a>, can you upload a file, otherwise <a href="https://stackoverflow.com/users/profiles/admin">@admin</a> can you take a look

...所以沒有必要的循環。

編輯2：

function urlify(texts) { 
    var urlRegex = /(@[\w]+)/g; 
    return texts.replace(urlRegex, function(match){ 
    var name = match.slice(1); 
    return '<a href="https://stackoverflow.com/users/profiles/' + name + '">' + match + '</a>' 
    }) 
} 

$(document).ready(function(){ 
    var text = $('.comment').html(function(index, text) { 
    return urlify(text) 
    }); 
});

http://plnkr.co/edit/tehEF4ESYXf4TTRR5lz8?p=preview

來源

2017-05-04 18:22:24 Phix

我不明白。我需要一個針對網站50或100條評論的解決方案，而不是在js中定義的一個示例字符串。你的解決方案給了我相同的結果，實際上它幾乎與剛剛使用的slice（1）相同的代碼...我如何替換！ALL！具有類「content1」的匹配。無論如何感謝您的努力。我希望我會找到一些 – Marla

@瑪拉看到更新。改變課程和其他你需要的東西。 – Phix

非常感謝。奇蹟般有效。對不起，沒有具體的第一個地方... – Marla

在評論中鏈接用戶

回答

相關問題