jQuery URL Slug生成函数输出异常,需去除数字与多余连字符
解决URL Slug生成的数字和多余连字符问题
我来帮你修复这两个问题,先直接给你修改后的代码,再一步步拆解问题原因:
var text = $("#post_title").val(); var converted = text .toLowerCase() .replace(/\d+/g, '') // 移除所有数字字符 .replace(/[^a-z]+/g, '-') // 将所有非小写字母的内容替换为连字符 .replace(/^-+|-+$/g, '') // 移除字符串开头和结尾的所有连字符 .replace(/-+/g, '-'); // 把连续的多个连字符合并成单个 $("#post_slug").val(converted);
针对你的两个问题的修复说明:
去除数字:
原代码里的\w正则元字符包含了数字(0-9),所以/[^\w-]+/g会保留数字。我新增的replace(/\d+/g, '')会直接删掉所有数字,这样输入top 5 ways to get in list时,数字5会被移除,后续处理后就能得到你想要的top-ways-to-get-in-list。去除首尾多余连字符:
原代码只把单个空格替换成连字符,但如果标题开头/结尾有空格,就会生成首尾连字符;如果有多个空格或混合符号,还会出现连续连字符。新增的replace(/^-+|-+$/g, '')专门匹配并删除开头或结尾的一串连字符;replace(/-+/g, '-')则把中间连续的多个连字符合并成一个,让slug更规范。
原代码的问题分析:
- 保留数字:
\w等价于[A-Za-z0-9_],所以你的/[^\w-]+/g会过滤掉除字母、数字、下划线、连字符之外的内容,但数字会被保留下来。 - 未处理首尾连字符:你只替换了单个空格为连字符,但没有处理替换后可能出现在首尾的连字符,也没处理多个空格导致的连续连字符问题。
内容的提问来源于stack exchange,提问作者Akshay Shrivastav
相关产品推荐
相关产品推荐

