Google reCAPTCHA 重置函数调用呈现的多个验证码答案

【问题标题】：Google reCAPTCHA reset multiple captchas rendered by function callGoogle reCAPTCHA 重置函数调用呈现的多个验证码
【发布时间】：2017-07-24 03:27:34
【问题描述】：

我有许多动态呈现的 reCAPTCHA，有时有 2 个有时 50 个取决于页面。我已经完成了渲染：

<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>
var CaptchaCallback = function(){
    $('.g-recaptcha').each(function(index, el) {
        grecaptcha.render(el, {'sitekey' : 'myKey'});
    });
};

并将其放置在我想要显示验证码的位置：

<div class="g-recaptcha" data-sitekey="myKey"></div>

我有 ajax 调用，将表单数据提交到 process.php，如果表单数据未验证，则返回自定义错误

$.ajax({
    type        : 'POST', 
    url         : 'process.php', 
    data        : $(this).serialize(), 
    dataType    : 'json'
})
    .done(function(data) { 
        if ( ! data.success) {    ...

它按预期工作，但现在我想向用户显示消息作为验证的一部分，如果他忘记解决验证码。

有

var response = grecaptcha.getResponse();
if(response.length == 0){
    $('.result').append('Captcha incorrect, please click I am not robot');
}

要重置验证码，请添加以下内容

if ( ! data.success) {
      grecaptcha.reset();

它的作用是：如果用户没有完成所有有效的表单，则重置验证码。

这一切仅适用于第一次出现的 reCAPTCHA。我需要它以某种方式告诉它只重置当前正在使用的验证码。

我最好的猜测是尝试

var form = $(this); //get current form
 grecaptcha.reset(form);

它不起作用，因为我需要小部件 ID，而不是表单。你能帮帮我吗？

【问题讨论】：

标签： javascript php jquery ajax recaptcha

【解决方案1】：

所有致谢https://stackoverflow.com/a/41860070/7327467

重置完成

var form = $(this); //store current form

var response = grecaptcha.getResponse(jQuery(form).find('#data-widget-id').attr('data-widget-id'));
if(response.length == 0){ //append error to result div
     form.find('.result').append('<div class="alert alert-danger">' + "Captcha incorrect" + '</div>');    }

为了重置 recaptcha，我添加了这个而不是之前的 "grecaptcha.reset();"

grecaptcha.reset(jQuery(form).find('#data-widget-id').attr('data-widget-id'));

希望这会有所帮助。

【讨论】：