【问题标题】:Urlify user input in real time实时 Urlify 用户输入
【发布时间】:2011-01-18 20:48:28
【问题描述】:

我想基本上有一个标题字段和一个 URL 字段的标题。

所以基本上用户输入了一个电影名称:“From Paris With Love”,它会在下面的字段中作为“from-paris-with-love”。

但是我想知道那里是否已经有类似的东西并且知道这里有人会知道! ;)

  • 亚伦

编辑:

http://www.thewebsitetailor.com/jquery-slug-plugin/ 完美!

【问题讨论】:

标签: jquery seo


【解决方案1】:

您可以使用 JavaScript 函数 encodeURIComponent,它将替换空格和任何其他不能在 URL 中使用的字符。

参考: https://developer.mozilla.org/En/Core_JavaScript_1.5_Reference:Global_Functions:encodeURIComponent

【讨论】:

  • 这对于许多场景来说似乎是理想的,因为它是 javascript 自己为 url 转换所做的。
【解决方案2】:

我在自己的应用程序中做了类似的事情。还有一些服务器端代码用于验证生成的值,但我创建了一个 JavaScript 助手来执行客户端“Urlify”。它将用 '-' 替换 ' '、':'、'\' 和 '/',然后删除所有非字母数字字符,最后并排清理多个 '-' 的任何实例- 侧面。

function FormatForUrl(str) {
    return str.replace(/_/g, '-')
        .replace(/ /g, '-')
        .replace(/:/g, '-')
        .replace(/\\/g, '-')
        .replace(/\//g, '-')
        .replace(/[^a-zA-Z0-9\-]+/g, '')
        .replace(/-{2,}/g, '-')
        .toLowerCase();
};

示例

  • “Hello World”-“hello-world”
  • “这辆车花了 1700 美元”-“the-car-cost-1700”
  • “嘿,我们去街角商店吧。” - “嘿,让我们去街角商店”
  • “www.mywebsite.com/page1.html”-“wwwmywebsitecom-page1html”
  • “email@mywebsite.com”-“emailmywebsitecom”

【讨论】:

    【解决方案3】:

    一个非常简单的方法是删除所有带有破折号的非字母数字字符:

    $(":input").bind("keyup", function(){
      $(".seo").text( $(this).val().replace(/[^a-z0-9]+/gi, "-") ); 
    });
    

    Jonathan say hello, world 转换为 jonathan-says-hello-world

    在线演示:http://jsbin.com/eqama/2/edit

    【讨论】:

    • jonathan's text becomes this 将变为 jonathan-s-text-becomes-this
    【解决方案4】:

    Django 项目使用了一个很好的 urlify 库。我认为许可证是 BSD 或 MIT。你需要检查一下。你可以在这里找到它:http://code.djangoproject.com/browser/django/trunk/django/contrib/admin/media/js/urlify.js

    该脚本将删除不必要的字符,将空格替换为破折号,并将重音和其他特殊字符替换为其他字符。

    我在 jquery 中使用它的方式是检查标题文本框何时失去焦点并更新我的 url

    //Note i have modify that URLify method to accept one argument instead of 2, don't need length $(document).ready(function() { $('#Title').focusout(function() { $('#Permalink').val(URLify($(this).val())); }); });

    【讨论】:

      【解决方案5】:

      这是我用的。

      $.fn.slug = function(){
          return this
                  .val()
                  .replace(/[^a-zA-Z 0-9-]+/g,'')
                  .toLowerCase()
                  .replace(/s/g,'-')
      };
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2011-05-09
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2014-06-01
        相关资源
        最近更新 更多