使用JavaScript在鏈接中包裝多個主題標籤

在Google搜索了好幾個小時後，我搜索了堆棧交換和反覆試驗，但我還是無法弄清楚，我正在用頭撞牆。任何幫助將非常感激！使用JavaScript在鏈接中包裝多個主題標籤

我試圖用鏈接替換段落中的主題標籤。我已經能夠做到這一點通過以下：

var str = $('.item p').html(), 
    regex = /(?:\s|^)(?:#(?!\d+(?:\s|$)))(\w+)(?=\s|$)/gi; 

function replacer(){ 
    var replacementString = $.trim(str.match(regex)[0]); 
    return ' <a href="https://www.example.com/'+ replacementString +'" target="_blank">' + replacementString + '</a>'; 
} 
$('.item p').html(str.replace(regex , replacer));

這成功地取代了主題標籤，但因爲我使用[0]，如果有多個主題標籤，然後只替換用＃標籤的文本第一。以下是我目前使用的JSFiddle。我需要嘗試弄清楚如何將每個hashtag替換爲該特定hashtag的鏈接。

我不確定我是否應該使用循環並遞增[0]，或者我是否完全按照錯誤的方向進行操作，還有更簡單的方法來執行此操作。

如果任何人有任何比我真的很感激的指針！

約翰

來源

2014-05-20 John

這樣你的函數的簡單變化會做你想要什麼：

function replacer(hash){ 
    var replacementString = $.trim(hash); 
    return ' <a href="https://www.example.com/'+ replacementString +'" target="_blank">' + replacementString + '</a>'; 
}

在你的情況下，有沒有必要做的.replace調用的replacer函數內部匹配，如該函數的第一個參數已經是當前匹配的子字符串。

JSFiddle Demo

編輯：如果你想中間沒有空格匹配井號標籤，你可以修改你的正則表達式一點：

(?:|^)(?:#(?!\d+(?:\s|$)))(\w+)(?=\s|#|$)

UPDATED JSFiddle Demo

來源

2014-05-20 20:45:51 DarkAjax

太棒了！奇蹟般有效！非常感謝您的幫助，我非常感謝。一個簡單的問題只是爲了幫助我理解這裏發生了什麼 - 'hash'變量如何傳遞給'replacer'函數？ – John

@John，沒問題，我很高興它爲你解決。 ''hash'變量（或者任何你想命名的變量）通過一組預定義的變量傳遞給替換者，你可以在MDN上看到更多關於這個**的信息（https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Global_Objects/String/replace #specifying_a_function_as_a_parameter）** – DarkAjax

現在更有意義！非常感謝鏈接，並再次爲您提供幫助。 – John

這裏有一個方法使用純javascript：

String.prototype.parseHashtag = function() { 
    return this.replace(/[#]+[A-Za-z0-9-_]+/g, function(t) { 
     var tag = t.replace("#","") 
     return '<a href="https://www.example.com/'+ tag + '" target="_blank">' + tag + '</a>'; 
    }); 
}; 

var input = "some randomg string #something some text"; 

console.log(input.parseHashtag()); // some randomg string <a href="https://www.example.com/something" target="_blank">something</a> some text

請參閱jsFiddle

來源

2014-05-20 21:01:17 Tom

謝謝湯姆，這個作品也很棒！ Darkajax有我正在尋找的確切解決方案，但這也很棒。非常感謝你的幫助！ – John

使用JavaScript在鏈接中包裝多個主題標籤

回答

相關問題