关于 html:如何防止 Google reCAPTCHA (v3) 启用它附加到的按钮

How to prevent Google reCAPTCHA (v3) from enabling the button it's attached to

我正在将 reCAPTCHA v3 添加到我网站上的用户注册表单中。以前,表单上的提交按钮在默认情况下是禁用的,并在经过一些验证(接受 ToS 等)后启用。但是,当我将 reCAPTCHA 添加到提交按钮时,reCAPTCHA 代码正在启用??该按钮,这是我不想要的。

我在按钮上设置了一个 DOM 断点,并验证它确实是启用该按钮的 reCAPTCHA 代码。我还有一个 codepen 演示了这里的问题,显示了一个带有 reCAPTCHA 的初始禁用按钮和另一个没有 reCAPTCHA 的初始禁用按钮:

1
2
    <button disabled class="g-recaptcha" data-sitekey="..." data-callback="onSubmit">Button w/ reCAPTCHA</button>
    <button disabled>Button w/o reCAPTCHA</button>

带有 reCAPTCHA 的一个被 reCAPTCHA 代码启用,另一个保持禁用状态。

reCAPTCHA v3 是否有任何配置选项可以避免自动启用它所连接的按钮?


我从未找到禁用禁用的选项,因此我最终放弃了基于属性的 reCAPTCHA 激活,转而以编程方式调用挑战。


试试这个:

1
2
3
4
5
6
function onSubmit(token) {
    setTimeout(function () {
        document.getElementById('your-button-id').disabled = true;
    }, 0);
    document.getElementById('your-form-id').submit();
}