引用错误:chrome中的grecaptcha未定义

时间:2017-11-08 10:57:53

标签: javascript jquery google-chrome recaptcha

我在同一张表格上有两张验证码。一个提交,另一个提交模式,将在表单提交后打开。所以我从这里阅读了很多答案后再渲染它。现在它可以正常使用 mozilla 但在chrome中提供引用错误。

我的谷歌api是:

<script src='https://www.google.com/recaptcha/api.js'></script>

然后我的代码在java脚本中呈现:

$('.g-recaptcha').each(function(index, el) {
        widgetId = grecaptcha.render(el, {'sitekey' : 'My-SITE-KEY'});
});

我的html读起来像这样

<div id="user_recaptcha" class="reCaptcha">
    <div id="e_Captcha" class="g-recaptcha" data-sitekey="<?php echo SITE_KEY; ?>" data-callback="recaptchaCallbackEvent"></div>
</div>

我在我的js顶部声明widgetId

1 个答案:

答案 0 :(得分:1)

Recaptcha有一个onload回调,一旦加载了recaptcha就会运行。将代码放在该回调函数中。

https://developers.google.com/recaptcha/docs/display

//call this function in your js
function onloadCallback() {
    $('.g-recaptcha').each(function(index, el) {
        widgetId = grecaptcha.render(el, {'sitekey' : 'My-SITE-KEY'});
    });
}

//load this script before your js is loading
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"></script>
//your html is absolutely fine.