需要自定义使用插件对 URL 进行 JQuery 验证

Posted 2023-05-09

【中文标题】需要自定义使用插件对 URL 进行 JQuery 验证

【英文标题】：JQuery validation on URL using plug-in needs to be customized

【发布时间】：2017-08-03 09:38:57

【问题描述】：

我正在使用 JQuery 验证插件来验证我的 web 目录站点上的表单。我需要允许用户以“www.url.com”的形式输入 URL，但插件要求用户输入 URL 为“http://www.url.com”。

有办法解决吗？请指教。感谢您的时间和建议。

【参考方案1】：

您可以采取两种方法：

只需添加新的自定义方法来适应它：

    jQuery.validator.addMethod("url2", function(value, element) 
      
      //just change below regex to your needs
      return this.optional(element) || /^[a-zA-Z]1,3\.[a-zA-Z0-9]+\.[a-zA-Z]1,3$/.test( value );
    , 'Please enter a valid url address.');  

并确保您的元素放置数据属性类型如下：

<input id="myid" type="url2"/>

重写用于 url 验证的插件方法，如下所示：

$.validator.methods.url = function( value, element ) 
  return this.optional( element ) || /^[a-zA-Z]1,3\.[a-zA-Z0-9]+\.[a-zA-Z]1,3$/.test( value );

【讨论】：

感谢您的帮助。请提及在规则和消息部分下放置的内容。

对于规则，在第一个和第二个选项中是正则表达式，根据您的需要进行调整。我已经给你举了一个例子。对于增强版，您可以尝试：^(http:\/\/www\.|https:\/\/www\.|http:\/\/|https:\/\/)?[a-z0-9]+([\-\.]1[a-z0-9]+)*\.[a-z]2,5(:[0-9]1,5)?(\/.*)?$

如果您想自定义消息，对于第一种方法，只需将文本 'Please enter a valid url address.' 更改为您的首选消息..

希望能回答您的问题

非常感谢您的解决方案。我尝试了第二种解决问题的方法，除了它接受即使“www.url.c”中的某些类型，其中 c 只是一个字母而不是至少 2 或 3 的事实。请分享您对此的见解.