首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何重用自定义的jQuery验证方法?

如何重用自定义的jQuery验证方法?
EN

Stack Overflow用户
提问于 2018-06-11 23:26:52
回答 1查看 673关注 0票数 1

我在项目中的许多表单上使用了jQuery验证。其中一些有特定的和棘手的验证需求,所以我编写了验证方法来处理它们,用通常的方式:

    $.validator.addMethod('fancyValidationTest', function (value, element, arg) { 
           ...code... });

其中一些方法在项目中的几个表单中都是需要的,因此我将方法定义放入包含对表单验证器-- $('#form_id').validate()..})或其他方法的调用的代码块中。但这很愚蠢--我最终将相同的方法剪切并粘贴到我的项目中的多个位置,而实际上我似乎应该将这些方法放到项目中的一个位置,然后让验证代码根据需要访问它们。

但到目前为止,还没有什么好消息。我尝试将这些方法移动到一个项目文件中,该文件加载了一堆其他常用的javascript代码,但这导致了控制台错误TypeError: undefined is not an object (evaluating '$.validator.addMethod'),这并不奇怪。顺便说一句,这是一个基于php的项目,所以包含表单和验证代码的“文件”实际上是动态构建的,而不是静态的.html文件。

那么:有没有办法把所有这些方法放在一个地方,让验证代码找到它们呢?在这里,剪切和粘贴不是正确的做法;谢谢!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-06-11 23:44:40

有没有一种方法可以把所有这些方法放在一个地方,让验证代码找到它们?

它与任何其他JavaScript或客户端代码没有什么不同。页面是如何构造的并不重要,只要您想使用这些脚本,就必须在每个单独的页面上包含这些外部文件。大多数人只是将它们放在公共的页眉或页脚文件中。或者,如果只在一页上需要它们,那么只将它们放在一页上。

...但这会产生一个并不奇怪的控制台错误TypeError: undefined is not an object (evaluating '$.validator.addMethod')

然后,您只是忘记了包含验证插件,或者您忘记在自定义.addMethod()方法的之前将其放入

这与使用此插件的additional-methods.js文件没有什么不同,该文件碰巧也只包含一个对.addMethod()的调用列表。

包括jQuery,然后包括插件,然后包括任何其他方法。

<!--// include jQuery //-->
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>

<!--// include the validation plugin //-->
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.js"></script>

<!--// optionally include the additional methods //-->
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/additional-methods.js"></script>

<!--// include YOUR additional methods //-->
<script src="path-to-your-methods-file.js"></script>

<!--// NOW you call .validate() and initialize plugin //-->
<script>
    $(document).ready(function() { // <- ensures the HTML markup is loaded first
        $('#myform').validate({    // <- initialize plugin
            // rules, options, etc.
        });
    });
</script>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50801231

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档