如何修复jQuery(“#contact_form”)。validate不是函数?

时间:2019-06-17 11:46:26

标签: javascript jquery html wordpress

我们在我们的网站上使用WordPress divi主题,并且我们有一个使用jquery validation的联系表

custom.js

jQuery(document).ready(function() {
    var contactForm = jQuery("#contact_form");

    contactForm.validate({
        rules: {
            full_name: {required:true, maxlength:100},
            email: {required:true, validateEmail: true},
            phone_number: {required:true}
        },
        submitHandler: function(form evt) {
            evt.preventDefault();
            var fullName = jQuery('#full_name').val();
            var email = jQuery('#email').val();
            var phoneNumber = jQuery('#phone_number').val();
            var contactFormUrl = contactForm.attr('action');

            jQuery.ajax({
                type: "POST",
                url: contactFormUrl,
                cache: false,
                data: {
                    fullname: fullName,
                    email: email,
                    phonenumber: phoneNumber
                }
            }).done(function(data, textStatus, jqXHR) {
                console.log("Success");
            }).fail(function(jqXHR, textStatus, errorThrown) {
                console.log("Fail")
            });

        }
    });

});

我们将custom.js缩小为custom.min.js。当我在控制台上查看我们的网站时,会看到以下信息:

Uncaught TypeError: e.validate is not a function
    at HTMLDocument.<anonymous> (custom.min.js?ver=1:1)
    at i (jquery.js?ver=1.12.4:2)
    at Object.fireWith [as resolveWith] (jquery.js?ver=1.12.4:2)
    at Function.ready (jquery.js?ver=1.12.4:2)
    at HTMLDocument.K (jquery.js?ver=1.12.4:2)

这是脚本加载到DOM中的顺序:

<script type='text/javascript' src='/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
    <script type='text/javascript' async='async' src='/divi-child/scripts/jquery.validate.min.js?ver=1'></script>
    <script type='text/javascript' defer='defer' src='/divi-child/scripts/v3/custom.min.js?ver=1'></script>

您知道如何解决吗?任何帮助是极大的赞赏。谢谢

1 个答案:

答案 0 :(得分:0)

如下修改您的代码:

<script type='text/javascript' src='/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='/divi-child/scripts/jquery.validate.min.js?ver=1'></script>
<script type='text/javascript' src='/divi-child/scripts/v3/custom.min.js?ver=1'></script>

您还可以在此处提供脚本文件夹内容吗?因为在cutom.min.js中使用了“ v3”,但在其他两个js中不使用。