jQuery / JS：如何創建一個SEO友好的鏈接

Question

我試圖從文本輸入框中的輸入創建一個SEO友好的鏈接。 當光標離開有問題的輸入時，我會對模糊事件執行此操作。 我可以讓輸入中的文本顯示在所需的輸入中（對於鏈接），但我的鏈接不是連字符，並且特殊字符不會替換為連字符。 我試圖做一個全局字符串替換，但表達式需要一個字符串，而不是一個變量。 至少從我能說的來看。 此外，我無法找到一種更好的方法來匹配特殊字符列表，而不是數組和循環。 有人可以幫忙嗎？ 我的願望是創建這樣的鏈接： http ： //domain.com/this-is-my-link 。 這是我的代碼：

$('#title').blur(function() {   
      var hyphenated;   
      hyphenated = urlTitle($(this).val());             
      $('#link').val(hyphenated);       
});


function urlTitle(text) {       
    var characters = [' ', '!', '@', '#', '$', '%', '^', '&', '*', '(', ')', '+', '=', '_', '{', '}', '[', ']', '|', '/', '<', '>', ',', '.', '?', '--']; 

    for (var i = 0; i < characters.length; i++) {
         var char = String(characters[i]);
         text = text.replace(/char/g, '-');

}           
    text = text.toLowerCase();
    return text;
}

Answer 1

問題在於你的逃避功能：

text = text.replace(/char/g, '-');

字面上匹配“char”。 因此，如果你給它I'm building a string out of chars ， 它將返回 i'm building a string out of -s 。

如果要使用變量動態組成正則表達式，則需要使用字符串和RegExp構造函數構建它。

text = text.replace(new RegExp("\\" + char, "g"), '-');

請注意，使用此格式時，您無需指定分隔字符（前后斜杠），並且標志作為第二個參數傳遞給構造函數。 我還添加了一個反斜杠來逃避您可能想要替換的任何特殊字符。

實例

Answer 2

你不能在正則表達式文字（/ char /）中使用這樣的變量名。 使用具有正確轉義值的RegExp對象，或者創建一個與要替換的所有字符匹配的正則表達式文字。

Answer 3

我有一個類似這樣的版本：

function urlTitle(text) {
    var removeRe = /[^\w\s]/ig,
        spacesRe = /[\s]/ig;
    return text.toLowerCase().replace(removeChars, '').replace(spaceChars, '-');
}

這有一個弱點，即雙重空間變成了雙重空間。 這可以通過另一個正則表達式來改進。