Erreur: l’élément d’espace réservé ReCAPTCHA doit être vide

J’utilise recaptcha avec mon application laravel.

Je veux juste vérifier la réponse de recaptcha sur la soumission de formulaire en utilisant jquery et arrêter l’utilisateur par une alerte qui valide le captcha.

mais, je ne pouvais pas arrêter la soumission de formulaire même si le captcha n’était pas rempli.

voici mon code

$('#payuForm').on('submit', function (e) { var response = grecaptcha.getResponse(); if(response.length == 0 || response == '' || response ===false ) { alert('Please validate captcha.'); e.preventDefault(); } }); 
{{ View::make('recaptcha::display') }}

Je reçois cette erreur dans la console du navigateur et le formulaire est soumis.

 Error: ReCAPTCHA placeholder element must be empty 

Vous chargez la bibliothèque Google Recaptcha deux fois.

https://www.google.com/recaptcha/api.js

Vous chargez la bibliothèque 2 fois

a choisi

  

ou

   

J’utilise ContactForm7 pour WordPress, qui a une intégration intégrée avec Recaptcha. J’ai aussi le plugin BWP Recaptcha, qui utilise les mêmes bibliothèques recaptcha. J’avais ajouté par erreur mes clés d’activation aux deux, ce qui entraînait un double chargement de la bibliothèque js. Une fois que j’ai retiré les clés du plug-in CF7, l’erreur a disparu.

 WARNING: Tried to load angular more than once. 

Dans AngularJs, cette erreur provoque de tels problèmes. Vous pouvez également vérifier les jquery.

Il suffit de taper ceci pour chaque captcha à la page si vous avez besoin de dynamic, y compris:

   

Mais c’est lent. Vous pouvez également définir toutes les recaptchas à la page initiale: https://developers.google.com/recaptcha/docs/display

J’ai eu cette erreur quand j’ai essayé de rendre reCaptcha sur un élément non vide

 
some element inside reCaptcha container

L’élément d’espace réservé reCaptcha doit être vide

 

Le même problème peut être causé par une connexion Internet lente.