Question

我有一个基本的Html 5表单，可以在较早的时候很好地工作，但是在我添加了google隐式Recaptcha之后。 HTML5验证停止工作。我在Google网上冲浪了很多，但是找不到办法

<script>
function onSubmit(token) {
document.getElementById("send").submit();
}
</script>

<form  id="send" action="process.php" method="post">
<input type="text" required name="Send" minlength="6" maxlength="16" placeholder="stackoverflow">
<button class="btn btn-primary g-recaptcha" data-sitekey="hidden" data-callback='onSubmit'>Submit</button>
</form>

即使未满足输入语句，它也会忽略该输入语句，并向用户提交没有错误消息的表格

Answer 1

在这里工作正常.....

<?php if(isset($_POST['hiddenfield'])){
echo 'submitted';
}
?>

<script>
function onSubmit(token) {
document.getElementById("send").submit();
}
</script>

<form  id="send" action="" method="post">
<input type="hidden" name="hiddenfield">
<input type="text" required name="Send" placeholder="stackoverflow">
<button class="btn btn-primary g-recaptcha" datasitekey="blahblahblahblahblahblahblahblah" data-callback='onSubmit'>Submit</button>
</form>

Answer 2

是的，因为Google Invisible reCAPTCHA使用普通按钮，因此没有提交按钮，因此不调用验证

以下是您可以执行以下两种操作的方法：

选项1：嘿，如果详细信息正确或不正确，您可能必须使用javascript进行身份验证，您可以参考https://developers.google.com/recaptcha/docs/invisible

选项2：，您也可以禁用按钮，直到满足条件为止，但强烈建议您选择选项一而不是选项二

Answer 3

对于 recaptcha v3，您可以这样做。我解决了这个问题。

<button 
                                data-sitekey="your key" 
                                data-callback='onSubmit' 
                                data-action='submit' 
                                type="submit" class="g-recaptcha btn btn-block btn-lg btn-primary mt-4">Send your message</button>
                        </div>

使用此更新提供的谷歌网站中的代码。基本上我们在提交之前手动检查表单验证状态，如果没有显示错误。

<script>
        function onSubmit(token) {            
            var applicationForm = document.getElementById("contact-form");    
            if (applicationForm.checkValidity()) {
                document.getElementById("contact-form").submit();                
            } else {
              applicationForm.reportValidity();
            }
                    
        }
    </script>

HTML 5验证不适用于Google Invisible Recaptcha

3 个答案: