如何重构重复的 jquery 验证方法

How can I refactor duplicate jquery validation methods?

本文关键字：jquery 验证 方法 何重构 重构      更新时间：2023-09-26

在我的rails应用程序中，我有这个jquery验证页面加载时加载的js.erb文件中的代码。

  if ($('#custom-tag').length) {
    $('#custom-tag').validate({
      onfocusout: false,
      rules: {
        tag: {
          minLengthSquish: 2,
          maxLengthSquish: 25
        }
      },
      tooltip_options: {
        tag: { placement: 'right', animation: false }
      }
    });
  }

表单在页面加载时存在，但用户可以通过 ajax 请求添加和删除标签。 对于每个请求，表单都会重新呈现，因为表单仅在标签计数为 5 或更少时才显示，因此我需要在每次加载表单时重新初始化 jquery 验证。 同样的代码存在于我的 add_tag.js.erb 和 remove_tag.js.erb 文件中，这些文件是通过 ajax 从控制器调用的。

我只是想知道在三个地方拥有这个重复的代码是否是实现这一目标的唯一方法。

表单在页面加载时存在，但用户可以通过 ajax 请求添加和删除标签。对于每个请求，表单都会重新呈现，因为表单仅在标签计数为 5 或更少时才显示，因此我需要在每次加载表单时重新初始化 jquery 验证。

您不能在同一表单上"重新初始化"jQuery Validify。 对.validate()的后续调用始终被忽略。

无论何时更改窗体，都可以使用 .rules() 方法动态add和remove规则。 

// on page load
$('#custom-tag').validate({ // initialize plugin on the form; can only be done once
    // options, etc.
    onfocusout: false,
    rules: {   // initial rules
        tag: {
            minLengthSquish: 2,
            maxLengthSquish: 25
        }
    }
});
// make changes dynamically
$('.newfields').each(function() { // add rules to multiple fields
    $(this).rules('add', {
        minLengthSquish: 5,
        maxLengthSquish: 50
    });
});
$('[name="tag"]').rules('add', {  // add rules to one field
    minLengthSquish: 30,
    maxLengthSquish: 55
});
$('[name="tag"]').rules('remove');  // remove all rules from one field
相关文章：