reCaptcha not generated while using jquery .load()

I've the following codes.

Mark Up

        <nav id=main>
            <ul>
                <li><a id=home href="#">Home</a></li>
                <li><a id=about href="#">About</a></li>
                <li><a id=contact  hre开发者_如何学Gof="#">Contact</a></li>
            </ul>
        </nav>
        <div id="page"></div>

Javascript

$(function() {
    $('nav#main ul li a').click( function() {
       var page = $(this).attr("id");
       $('div#page').load("pages/"+page+".php");
    });
});

In the contact page, I've integrated reCaptcha in a form.

The contact page can be accessed using the URL www.mydomain.com/?page=contact directly also. While accessing the page by typing the URL in the address bar, the reCaptcha shows up fine. But when clicked on the contact link from the navigation and processing using the javascript I've provided above, the reCaptcha doesn't show up.

page.php

<div>
<form>
<?php
        require_once($captchaPath);
    $publickey = "key"; // you got this from the signup page
    echo recaptcha_get_html($publickey);
?>
<button name="send" type="button" value="Send">Send</button>
</form>
</div>

What can be the problem?

Haven't gone through your code, but Recaptcha has updated their URL. Just wanted to suggest if that could be the problem.

You need to update the https://api-secure.recaptcha.net to https://www.google.com/recaptcha/api

maybe I'm wrong, but I think you want to load the page 'contact.php', 'home.php and/or 'about.php'. you don't create any parameter.