javascript - PreventDefualts 不允许在 Invisible ReCaptcha 中提交表单

标签 javascript php html recaptcha

最近我尝试使用 Google 的隐形 ReCaptcha,因此我复制了 Google 在其官方文档中提到的相同示例;但表单没有提交,我们无法进入下一页(表单操作页面)。

客户端片段:

<html>
<head>
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <script>
        function onSubmit(token) {
            document.getElementById("myform").submit();
        }
        function validate(event) {
            event.preventDefault();
            if (!document.getElementById('field').value) {
                alert("Please enter your name.");
            } else {
                grecaptcha.execute();
            }
        }
        function onload() {
            var element = document.getElementById('submit');
            element.onclick = validate;
        }
    </script>
</head>
<body>
<form id='myform' method="post" action="test.php">
    Name: (required) <input id="field" name="field">
    <div id='recaptcha' class="g-recaptcha"
         data-sitekey="mysitekeyxXX"
         data-callback="onSubmit"
         data-size="invisible"></div>
    <button id='submit'>submit</button>
</form>
<script>onload();</script>
</body>
</html>

服务器片段(test.php):

var_dump($_POST['g-recaptcha-response']);

还有其他用于谷歌验证过程的代码,但无论如何它都不会进入此页面(操作页面)

最佳答案

我不确定您是否已 1:1 复制所有内容,或者 Google 是否更新了一些文档,但此功能与 reCAPTCHA 的功能有点不同 click here :

    function onSubmit(token) {
        document.getElementById("myform").submit(); // <- this
    }

它不会工作,因为你有一个 ID 为“提交”的按钮。

<button id='submit'>submit</button>

要使其正确提交,您必须将按钮的 id 重命名为其他名称。
event.preventDefault() 还会阻止执行默认表单提交,因此您应该保持原样。解决这个名称问题后,它将完美运行!

关于javascript - PreventDefualts 不允许在 Invisible ReCaptcha 中提交表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46713883/

相关文章:

Javascript 在 Safari 中工作,但在 Chrome 中不工作

javascript - 如何在asp.net中每3秒拉伸(stretch)和更改背景图像

php - 为什么 PHP 函数 strip_tags() 会删除非标签的数据?如何避免这种情况?

php - 使用 GROUP_CONCAT 时出错?

html - css语法只获取另一个元素中的一个元素

html - 使用 Angular-Material 进行简单的 CSS 修改

javascript - 我似乎无法让 Bootstrap Carousel 在本地工作,但它可以在 codepen 上工作

javascript - 代理站点以便能够在 iframe 中进行所见即所得编辑 - 它是如何工作的?

php - 如何使用数据库中的颜色在 PHP 中动态更改 css 背景颜色

css - Bootstrap 3 - 是否可以像这样右对齐表单和下拉列表?