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，it will return i'm building a string out of -s。

如果要使用变量动态组成正则表达式，则需要使用字符串和RegExp constructor来构建它。

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

请注意，使用此格式时，您不需要指定分隔字符（前后斜杠），并且标志作为第二个参数传递给构造函数。我还预装了一个反斜杠来逃避你可能想要替换的任何特殊字符。

Live example

Answer 2

您不能在正则表达式文字中使用变量名称（/ char /）。使用具有正确转义值的RegExp对象，或者创建一个与要替换的所有字符匹配的正则表达式文字。

Answer 3

我有一个类似这样的版本：

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

这有一个弱点，即双倍空间变成了双重''。这可以通过另一个正则表达式进行改进。

jQuery / JS：如何创建一个SEO友好的链接

3 个答案: