Recaptcha est un outils de captcha fournis par google. son code d’installation javascript ne permet pas de le faire fonctionner en ajax. Je vous propose de le faire fonctionner avec Jquery très simplement.

Site Officiel : http://www.google.com/recaptcha
Site Officiel de l’installation (sans plugin) : http://code.google.com/apis/recaptcha/docs/display.html

Recaptcha ne supporte pas l’Ajax

Si vous voulez afficher votre captcha en Ajax cela ne fonctionnera pas car le A de Ajax veux dire Asynchrone. (C’est à dire que le chargement peut avoir lieu a un autre moment qu’au chargement initial de votre page web)

Le problème réside dans les 2 scripts de google qui utilisent la fonction javascript « document.write() » qui ne fonctionne que lors du chargement de la page et donc pas en asynchrone.

Solution :

1) Continuer a faire comment avant.

C’est a dire charger votre page en Ajax en utilisant le code officiel donné par google.
En utilisant un framework tel que jquery ou prototype, de manière à ce que les balise « script » soit bien exécuter.
Le script qui nous intéresse à charger est le suivant :

<script type="text/javascript"
     src="http://www.google.com/recaptcha/api/challenge?k=your_public_key">
  </script>

En le chargeant vous définirez la variable globale « RecaptchaState », nécéssaire à la suite des opérations. C’est pour cela que vous devez conserver l’inclusion de ce fichier.

var RecaptchaState = {
...
}

Par contre la ou le système ne vas pas fonctionner est dans le document.write en fin de cette page.
1) Comme nous somme en ajax, le document.write ne fonctionne pas
2) Le fichier inclus, http://www.google.com/recaptcha/api/js/recaptcha.js, contiens aussi des document.write, ce qui ne fonctionnera pas plus.

2) Inclure un bon recaptcha.js

A vous donc d’executer le document.write, apres l’execution de l’Ajax, c’est à dire changer votre fichier javascript.

Voici le code d’exemple en Jquery :

$.ajax({
  ....
  success: function() {
    var script = document.createElement('script');
    script.src = "/myRewritedCatptchaJs.php";
    script.type = 'text/javascript';
    $("body").append(script);
  }
});

Et le code de myRewritedCatptchaJs.php :

<?php
$recaptchaJs = file_get_contents("http://www.google.com/recaptcha/api/js/recaptcha.js");
$recaptchaJs = str_replace('document.write','$("body").append',$captcha);
echo $recaptchaJs ;

Avec ce code, votre serveur web (coté Php) télécharge le fichier de Google, remplace le « document.write » par « (votre selecteur Jquery).append »,
Dans l’exemple ci-dessus, le selecteur est « body » c’est à dire, donc votre captcha sera ajouté au bas de votre page.
A vous de mettre votre selecteur Jquery de l’endroit ou vous désirer afficher votre ReCaptcha.

PS: il est bien évident que ce script php est minimaliste et ne supportera pas une forte charge, à vous de cacher le contenu et de le mettre à jour de temps en temps, de lui assigné le bon Content-Type etc.