自定义验证规则不适用于基于类的规则

Question

我正在使用 jQuery 验证插件。我添加了一个自定义验证规则作为

$.validator.addMethod("alphanumeric", function(value, element) {
   return this.optional(element) || /^[a-zA-Z][a-zA-Z0-9]+$/i.test(value);
}, "No special characters");

为了配置validator，我正在使用这个。

var $validator = $("#wizardForm").validate({
       rules: {
           entity_name: {
             required: true,
             alphanumeric: true
           }
       }
 });

alphanumeric 规则非常适合带有name="entity_name" 的元素

然后，我将向具有 rename-prop 类的元素添加一个规则，如下所示。

$('#wizardForm').find('.rename-prop').each(function() {
     $(this).rules('add', {
        required: true,
        alphanumeric: true
     });
 });

问题

这条required 规则非常适用于rename-prop 类的元素，但alphanumeric 规则不适用于rename-prop 类元素。虽然它适用于entity_name 字段。

Answer 1

使用这个正则表达式 /^[\w.]+$/i

您可以使用正则表达式的字符集[]来选择多个字符。

正则表达式中的

^ 表示它从字符串的开头开始匹配。

\w 在正则表达式中表示它接受所有字母数字 (A-Za-z0-9) 和下划线 (_)。

我已经添加了 .字符集里面允许字符。也。

您可以在 [] 字符集中添加更多字符以允许它们。

• 在正则表达式中意味着它将继续匹配字符串中的所有字符。

正则表达式中的

$ 表示如果它的多行，它将检查到行尾

正则表达式中的 i 是一个标志，表示其不区分大小写。

  $(document).ready(function () {

  jQuery.validator.addMethod("alphanumeric", function(value, element) {
  return this.optional(element) || /^[\w.]+$/i.test(value);
   }, "Letters, numbers, and underscores only please");

    $('#myform').validate({ // initialize the plugin
    rules: {
        field: {
            required: true,
            alphanumeric: true
        }
    },
    submitHandler: function (form) { // for demo
        alert('valid form submitted'); // for demo
        return false; // for demo
    }
    });

  });