I can't see where I'm going wrong. I've tried everything I could think of, reCAPTCHA is just not working with the Ajax API. Here's what my code looks like:
<!-- this is in <head> -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://api.recaptcha.net/js/recaptcha_ajax.js"></script>
<script type="text/javascript">
$(document).ready(function() {
Recaptcha.create("my key here", "recaptcha_widget", {
"theme": "custom",
"lang": "en",
"callback": function() { console.log("callback"); } // this doesn't get called
});
});
</script>
<!-- ... this is in <body> -->
<div id="recaptcha_widget" style="display: none">
<div id="recaptcha_image"></div>
<div id="recaptcha_links">
<a href="javascript:Recaptcha.reload()">get another</a> •
<a class="recaptcha_only_if_image" href="javascript:Recaptcha.switch_type('audio')">switch to audio</a>
<a class="recaptcha_only_if_audio" href="javascript:Recaptcha.switch_type('image')">switch to image</a> •
<a href="javascript:Recaptcha.showhelp()">help</a>
</div>
<dt>Type the words</dt>
<dd><input type="text" id="recaptcha_response_field" name="recaptcha_response_field"></dd>
</div>