Google reCaptcha sıfırlama çalışmıyor

Question

Formumuzu AJAX aracılığıyla gönderdiğimde ve bazı giriş hataları veya formu gönderildiğinde Google reCaptcha widget'ını sıfırlamak istiyorum. Aynı sayfada birden çok widget kullanıyorum, bu yüzden bu widget'ları açık bir şekilde oluşturuyorum.

Benim HTML kodu:

<div class="g-recaptcha" id="recaptcha-1"></div> 
<div class="g-recaptcha" id="recaptcha-2"></div> 
... 
<div class="g-recaptcha" id="recaptcha-20"></div> 

Yükleme Widget

<script src="https://www.google.com/recaptcha/api.js?onload=reCaptchaCallback&render=explicit&hl=en" async defer></script> 
<script> 
    var reCaptchaCallback = function() { 
     var elements = document.getElementsByClassName('g-recaptcha'); 
     for (var i = 0; i < elements.length; i++) { 
      var id = elements[i].getAttribute('id'); 
      grecaptcha.render(id, { 
       'sitekey' : 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX' 
      }); 
     } 
    }; 
</script> 

sonra teslim formu:

var id = $('.g-recaptcha', form).attr('id'); 
grecaptcha.reset(id); 

Form gönderildi formun örneğidir.

Form doğru şekilde doldurulduğunda her şey düzgün çalışıyor. Ancak reCaptcha sıfırlamaz veya yeniden yüklenmez. Bu grecaptcha.reset()'u deneyin, ancak sonuç yok.

Herhangi bir fikrin var mı?

Answer 1

grecaptcha.reset() yöntemi, isteğe bağlı bir widget_id parametresini kabul eder ve belirtilmemişse varsayılan olarak varsayılan ilk pencere aracını kabul eder. Oluşturulan her pencere öğesi için widget_id, grecaptcha.render() yönteminden döndürülür. Yani bu kimliği saklamak ve bu özel widget'ı sıfırlamak için bunu kullanmak gerekir:

var widgetId = grecaptcha.render(container); 
grecaptcha.reset(widgetId); 

See here.

Answer 2

Yanlış kimliği iletiyorsunuz.

$('.g-recaptcha', form).attr('id');

Sizin seçici 20 ReCaptcha widget'ı yakalamak, ancak yalnızca tek bir DOM id (ilk ReCaptcha) döndürecektir. Yani kodun aslında ilk recaptcha sıfırlanıyor.

Answer 3

Sadece dinamik bir widget oluşturmak için kodunuzu düzenlediniz.

<script> 
    var reCaptchaCallback = function() { 
     var elements = document.getElementsByClassName('g-recaptcha'); 
     for (var i = 0; i < elements.length; i++) {     
      widgetId+i = grecaptcha.render('recaptcha-'+i, { 
       'sitekey' : 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX' 
      }); 
     } 
    }; 
</script> 

Ve başarıyla AJAX başarıda yukarıdaki görevi, değişiklik tamamladıktan sonra: tepkisini İşte

grecaptcha.reset(widgetId+id); 

id Döngü için aşağıdan oluşturulduğunun aynı olacaktır.