Is there a way to programmatically enable/disable Google's reCaptcha widget? The purpose for this would be to prevent a user from clicking the I'm not a robot checkbox prematurely.
I found a solution thanks to this answer.
Add this CSS:
.disabled-element {
opacity: 0.65;
pointer-events: none;
}
Add the disabled-element class to the div containing the reCaptcha element:
<script>
var onloadCallback = function() {
alert(grecaptcha is ready!);
};
</script>
<div class=disabled-element id=captcha></div>
...
<script src=https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit async defer></script>
And finally, whenever you're ready to enable the reCaptcha element, remove the class:
$(#captcha).removeClass(disabled-element);
