GettUncaught Error: reCAPTCHA placeholder element must be empty ; loaded only once

Question

我在使用 v2 隐形验证码时遇到以下错误

recaptcha__en.js:513 Uncaught Error: reCAPTCHA placeholder element must be empty at YG (recaptcha__en.js:513) at recaptcha__en.js:520 at Array.forEach () at pG (recaptcha__en.js:520) at xG (recaptcha__en.js:517) at recaptcha__en.js:507 at j$ (recaptcha__en.js:304) at RZ (recaptcha__en.js:507) at recaptcha__en.js:523 at recaptcha__en.js:543

我已经搜索过了，但到处都说你在多次加载脚本，我想我没有这样做

以下是我的代码

    <div class="osnlogin-button">
        <a type="submit" href="" id="recaptcha-submit" class="osnlogin-signin-btn g-recaptcha"><span class="signin lightboxed">Login</span></a>
    </div>
    <div class="g-recaptcha" data-sitekey="xxx" data-bind="recaptcha-submit" data-callback="onCapchaValidated">
    </div>

    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    var onCapchaValidated = function () {
        $('#loginForm').submit();
    };

Answer 1

刚修好。对多个属性使用 "g-recaptcha" class。我认为它应该只在页面中的一个元素上。

原创

 <div class="osnlogin-button">
    <a type="submit" href="" id="recaptcha-submit" class="osnlogin-signin-btn g-recaptcha"><span class="signin lightboxed">Login</span></a>
</div>
<div class="g-recaptcha" data-sitekey="xxx" data-bind="recaptcha-submit" data-callback="onCapchaValidated">
</div>

已更新

<div class="osnlogin-button">
    <a type="submit" href="" id="recaptcha-submit" class="osnlogin-signin-btn"><span class="signin lightboxed">Login</span></a>
</div>
<div class="g-recaptcha" data-sitekey="xxx" data-bind="recaptcha-submit" data-callback="onCapchaValidated">
</div>

终于成功了