I'm pretty sure this is a bug in reCaptcha.
I fixed this by reworking my page, but here's the story:
I put the reCaptcha in a modal dialog box area of my page. It is a registration form, and at the end, I throw up a message in the modal part of the form (using javascript) that says "Is this the information you want to use?" and show them an abbreviated version of their data. Under that I had the reCaptcha, along with both "Submit" and "Cancel" buttons. The Submit didn't get active until the reCaptcha validated.
Anyway... this worked fine with all browser in Windows, but in Mac (Safari and Chrome on both MacBook and iPad), not only wouldn't it work, but the reCaptcha itself wouldn't even show!
Since we were already open for business and couldn't wait for a workaround (or someone solves my problem), I moved the reCaptcha to the main form and now the user has to validate the reCaptcha before even seeing the confirm screen.
However, IMHO, the original way should work. I'm pasting in the HTML below to show it.
PS: This is a bug report, not a request for "why do you do it this way?" comments.
<div id="id01" class="w3-modal" style="display:none";>
<div class="w3-modal-content w3-card-4 w3-animate-zoom" style="max-width:600px">
<form class="w3-container" action="#">
<div id="inner" class="innertext">
</div>
<div class="w3-container w3-border-top w3-padding-16 w3-light-grey">
<div id="inner1" style="display:none";>
<!-- Localhost version --->
<!-- <div class="g-recaptcha" data-sitekey="<key>"></div>-->
<!-- Live version --->
<div class="g-recaptcha" data-sitekey="<key>"></div>
<div id="captcha"></div>
<button onclick="nowsubmit()" type="button" class="w3-button w3-blue">Confirm</button>
<button onclick="document.getElementById('id01').style.display='none'" type="button" class="w3-button w3-blue">Cancel</button>
</div>
<div id="inner2" style="display:none";>
<button onclick="document.getElementById('id01').style.display='none'" type="button" class="w3-button w3-blue">Okay</button>
</div>
</div>
</form>
</div>
</div>
Also, here's the JS Function:
function nowsubmit() {
var v = grecaptcha.getResponse();
if(v.length == 0)
{
document.getElementById('captcha').innerHTML="Please check the checkbox above.";
return false;
} else {
document.getElementById('hasbook').value=v;
}
document.getElementById('online_reg').submit();
}