javascript - Why is reCaptcha Stealing Focus on Page Load - Stack Overflow

admin管理员组

文章数量:1343371

Recaptcha has suddenly started stealing the focus when it's loaded on a page, which causes the page to scroll down to the form (very annoying). This appears to be a new bug?

See example:

Apparently, the main Google Library that loads reCaptcha ;lang=en calls for a .js

In there, the init() function appears to fire a reload() function, which is causing the Recaptcha.focus_response_field() function to load.

There appears to be nothing we can do... until they fix it?

Does anyone know how to report this bug to Google? Or a way to work around this?

Recaptcha has suddenly started stealing the focus when it's loaded on a page, which causes the page to scroll down to the form (very annoying). This appears to be a new bug?

See example: http://www.gullixson./Contact-Us

Apparently, the main Google Library that loads reCaptcha http://www.google./recaptcha/api/challenge?k=UNIQUEAPIKEY&lang=en calls for a http://www.google./recaptcha/api/js/recaptcha_canary.js

In there, the init() function appears to fire a reload() function, which is causing the Recaptcha.focus_response_field() function to load.

There appears to be nothing we can do... until they fix it?

Does anyone know how to report this bug to Google? Or a way to work around this?

• javascript
• recaptcha

Share Improve this question Follow asked Apr 26, 2014 at 1:43 Chadwick MeyerChadwick Meyer 7,38177 gold badges4848 silver badges6868 bronze badges 3

• 1 oh, that does look nasty! Maybe you can delay loading the ReCaptcha at all until the user scrolls it into view? – Michael Butler Commented Apr 26, 2014 at 1:59
• Ugh. I just started having this problem, too. I was about to post a question, but I found this one! – iglvzx Commented Apr 26, 2014 at 21:51
• Google has fixed the bug, so this is no longer an issue (ATM), but if it happens in the future Mitch's answer is probably the best. – Chadwick Meyer Commented Apr 28, 2014 at 18:02

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 6

The easiest workaround is just to redefine Recaptcha.focus_response_field after the recaptcha JS has loaded.

// Load recaptcha JS

// ...

Recaptcha.focus_response_field = function(){return false;};

This makes the focus operation essentially turn into a non-op.

Edit: Tested and working on Chrome, Firefox and IE9

I solved this problem with a little jQuery fix code:

$(document).ready(function() {
    $(window).focus(function(){
        /* If on load is detected a div to show reCaptcha code 
           ('div#captcha') simply force the focus to the top of the page. 
         */
       if( $('body').has('div#captcha') ){
         $('html,body').animate({scrollTop:0}, 1000, 'swing');
       }
    });
});

Quick workaround using jQuery:

<style>
#recaptcha_widget_div{
display: none;
}
</style>

...existing recaptcha code here...

<script>
$("body").on("focus", "input, textarea", function() {
    $("#recaptcha_widget_div").show();
});
</script>

I had the same problem yesterday.

Today, I checked again and it seems Google has fixed the problem.

You don't need to apply any hacks using jQuery anymore.

Try to ment the Recaptcha.focus_response_field:

Recaptcha.create("your_public_key", element, {
   theme: "red",
   callback: Recaptcha.focus_response_field // <-- Comment this line
});

本文标签： javascriptWhy is reCaptcha Stealing Focus on Page LoadStack Overflow