reCaptcha doesn't load intermittently

I'm currently building a website that uses reCaptcha to provide some security for the customer entry form.

Because I have to cater for new customer and existing customers on one page, using jQuery to switch between two different forms, I am using the Ajax API to create a new reCaptcha image each time the form is switched.

Usually, the works fine. However, recently I've started running into problems where the reCaptcha image on one of the forms doesn't load at all, while the image on the other form is fine.

Using the various developer tools in the different browsers, I've found the following errors with the reCaptcha Ajax API at http://www.google.com/recaptcha/api/js/recaptcha_ajax.js.

TypeError: Result of expression 'a("recaptcha_image")' [null] is not an object (Safari and Firefox).
Uncau开发者_Go百科ght TypeError: Cannot read property 'style' of null (Chrome)

If this is an error with the reCaptcha_ajax.js file, obviously there's not much I can do, but is there any way I may be able to cater for this.

I found the problem. I was using a label next to the radio button with a onclick event that called the radio buttons click function.

For some reason, this was causing the issue loading the captcha image. But only when I clicked on the label.

Since I have no idea why this was the case, I have just removed the ability to click the label.

This error usually occurs when ReCaptcha widget is attempting to place itself in an element that doesn't exist on the page.