Javascript 未捕获类型错误：document.getElementById（…）.submit不是函数联系人表单-不可见_Javascript_Jquery_Html_Contact Form_Invisible Recaptcha

Javascript 未捕获类型错误：document.getElementById（…）.submit不是函数联系人表单-不可见

javascript jquery html

Javascript 未捕获类型错误：document.getElementById（…）.submit不是函数联系人表单-不可见,javascript,jquery,html,contact-form,invisible-recaptcha,Javascript,Jquery,Html,Contact Form,Invisible Recaptcha,出于安全原因，我尝试将不可见的recaptcha添加到我的联系人表单中我在控制台中遇到此错误：未捕获类型错误：document.getElementById（…）。提交不是作用我错在哪里必要的属性包括类名“g-recaptcha”、数据sitekey属性中的站点密钥以及处理数据回调属性中验证码完成的JavaScript回调的名称谷歌公司详情如下: HTML <!DOCTYPE html> <html> <head> <title&g

出于安全原因，我尝试将不可见的recaptcha添加到我的联系人表单中

我在控制台中遇到此错误：

未捕获类型错误：document.getElementById（…）。提交不是作用

我错在哪里

必要的属性包括类名“g-recaptcha”、数据sitekey属性中的站点密钥以及处理数据回调属性中验证码完成的JavaScript回调的名称

谷歌公司

详情如下:

HTML

<!DOCTYPE html>
<html>
<head>
    <title></title>
     <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <script>
        function onSubmit(data) {
            document.getElementById("contact").submit();
        }
    </script>
</head>
<body>
    <p class="contacts__form-title">Title</p>
    <form action="results.php" class="js-form" id="contact" method="post" name="contact">
        <div class="form-group">
            <input class="form-field js-field-name" placeholder="Your name" required="" type="text"> <span class="form-validation"></span> <span class="form-invalid-icon"><i aria-hidden="true" class="mdi mdi-close"></i></span>
        </div>
        <div class="form-group">
            <input class="form-field js-field-email" placeholder="Your e-mail" required="" type="email"> <span class="form-validation"></span> <span class="form-invalid-icon"><i aria-hidden="true" class="mdi mdi-close"></i></span>
        </div>
        <div class="form-group">
            <textarea class="form-field js-field-message" placeholder="Type the message here" required=""></textarea> <span class="form-validation"></span> <span class="form-invalid-icon"><i aria-hidden="true" class="mdi mdi-close"></i></span>
        </div><button class="site-btn site-btn--form g-recaptcha" data-badge="invisible" data-callback="onSubmit" data-sitekey="6LdZIzkUAAAAAKLqsuoYZIh2cZqy3s0nwhkZpEC9" type="submit" value="Send">Send</button>
    </form>
<script src="assets/js/jquery-2.2.4.min.js"></script>
</body>
</html>

包含Jquery库？是的，在页脚Jquery 2.2.4中，您是否尝试将

脚本

标记移动到正文中，最后？我也尝试移动，没有结果：（您可以尝试window.onload=onSubmit（）；因为我相信onSubmit甚至在页面加载之前就已执行；因此它找不到联系人，因此出错；请尝试一下；

'use strict';


//Validation forms
function validateForm(selector) {
    Array.from(document.querySelectorAll(selector)).forEach(item => {
        item.addEventListener('input', (e) => {
            if(e.target.value === ''){
            item.dataset.touched = false;
            }
        });
        item.addEventListener('invalid', () => {
            item.dataset.touched = true;
        });
        item.addEventListener('blur', () => {
            if (item.value !== '') item.dataset.touched = true;
        });
    });
};

validateForm('.js-form .form-field');

var form = document.querySelector('.js-form');
var formName = '.js-form';

form.addEventListener('submit', function(e){
    submitForm(e, formName);
});

function submitForm(e, formName) {
    e.preventDefault();
    var name = $(formName + ' .js-field-name').val();
    var email = $(formName + ' .js-field-email').val();
    var message = $(formName + ' .js-field-message').val();

    var formData = {
        name: name,
        email: email,
        message: message
    };

    $.ajax({
        type: "POST",
        url: 'mail.php',
        data: formData,
        success: function () {
            console.log('success');
            //...
        },
        error: function () {
            console.log('error');
            //...
        }
    });
}