Javascript 清理 URL 正则表达式

Posted 2023-05-08

【中文标题】Javascript 清理 URL 正则表达式

【英文标题】：Javascript Clean URL Regex

【发布时间】：2010-11-27 07:11:33

【问题描述】：

我正在构建一个包含几个字段的 CMS 新闻部分，但这个问题特别需要的是“标题”和“URL 参考”字段。当用户输入文章标题时，我希望 javascript/jQuery 替换标题字段中的文本，并通过使用破折号 (-) 删除任何空格和奇怪字符来创建一个“干净”的 URL 片段。

例如

Kris 的有趣新文章（标题）

kris-fun-new-article（网址参考）

这是代码，但我似乎无法弄清楚如何替换多个空格和特殊字符

$('#title').keyup(function() var ref = $(this).val().toLowerCase().replace('\','-'); $('#reference').val(ref); );

此外，就像在标题“Kris' FUN new Article”中一样，正则表达式应该将“Kris'”（引号和空格）替换为“kris-”（一个破折号）。基本上识别是否有两个特殊字符并排并用一个破折号替换。不喜欢这种“kris--fun-new-article”。

提前致谢

【参考方案1】：

Samir Talwar 的回答是正确的，只是在正则表达式的末尾需要一个标志 /.../g 来表示全局匹配。没有 /.../g 只会替换第一个匹配项。

Torez，这是你的函数的更新版本：

$('#title').keyup(function()
    var ref = $(this).val().toLowerCase().replace(/[^a-z0-9]+/g,'-');
    $('#reference').val(ref);
);

（抱歉，Samir，我本来只想评论你的回复，但我还没有足够的声望点。）

【讨论】：

如果您在标题的开头和/或结尾有不需要的字符，您最终会得到一个尾随或前导的“-”字符。使用额外的正则表达式文本替换行，如下所示：ref = ref.replace(/(^-|-$)/g,''); 任何前导或尾随 '-' 字符都将被删除，并使 URL 更清晰。

【参考方案2】：

试试：

function slug(str) 
  if (!arguments.callee.re) 
    // store these around so we can reuse em.
    arguments.callee.re = [/[^a-z0-9]+/ig, /^-+|-+$/g];
    // the first RE matches any sequence of characters not a-z or 0-9, 1 or more 
    // characters, and gets replaced with a '-'  the other pattern matches '-'
    // at the beginning or end of a string and gets replaced with ''
  
  return str.toLowerCase()
   // replace all non alphanum (1 or more at a time) with '-' 
   .replace(arguments.callee.re[0], '-')
   // replace any starting or trailing dashes with ''
   .replace(arguments.callee.re[1],'');


slug("Kris' FUN new Article ");
// "kris-fun-new-article"

【参考方案3】：

您需要正则表达式上的全局标志 - g - 以及某种用于倍数的量词（+ = 一个或多个匹配项，似乎就在这里）。

比如replace(/[' insert further chars you care about here]+/g,'-')

【参考方案4】：

我认为您想要一个包含特殊字符和空格的字符类，然后您可以像这样指定一个或多个字符类实例：

[specials charaters " "]+

并用破折号替换匹配项

【参考方案5】：

怎么样？

str = str.toLowerCase().replace(/[^a-z0-9]+/, '-');

应该用破折号替换不是字母或数字的所有内容，+ 表示一次需要多个字符。