检查 google recaptcha 是否被选中或已被填充

Question

我正在使用 google recaptcha

<label for="template-contactform-botcheck">Botcheck</label>
<div id="recaptcha_sme"></div>

我想验证它是否被选中，是否已被填充，我的方法是通过这段代码（参考下面）

if ($("#recaptcha_sme #recaptcha-anchor").hasClass("recaptcha-checkbox-checked")) {
    alert("the captcha has been filled");
} else {
    alert("Please fill the captcha!");
}

而且我不打算通过服务器端验证（google recaptcha API 检查），我只想在 google 时收到通知（使用警报提示） recaptcha 已检查或填写。有什么想法、线索、建议、建议吗？

下面是我完整的表单提交脚本代码（jquery中的提交功能）。

$("#sme_application_dialog form").submit(function(e){
    if ($(this).find("#recaptcha_sme #recaptcha-anchor").hasClass("recaptcha-checkbox-checked")) {
        alert("the captcha has been filled");
    } else {
        alert("Please fill the captcha!");
    }
    e.preventDefault();


});

正如您从上面的参考中看到的那样，我只是想检查 id 为 "recaptcha-anchor" 的元素是否具有 "recaptcha-checkbox-checked" 的 class（我可以使用 chrome dom 资源管理器从 DOM 结构中看到，每次 google recaptcha 是时，class 已添加到具有“recaptcha-anchor”ID 的元素已检查或已填写）所以我认为这可能会起作用，但遗憾的是它不起作用。

PS：假设我有一个 ID 为 "sme_application_dialog_form" 的 div，并且在它里面有一个 from 和 inside that form，有 google recaptcha 和我有“$(document).ready”。假设所有设置和工作（除了我正在检查 google recaptcha 的验证已检查或已填充）

Answer 1

您可以通过获取响应值是否为空来在回调函数上对其进行验证。

回调函数

function submit(){ 
     var response = grecaptcha`.`getResponse();
     if(response != '0'){
           //captcha validated and got response code
           alert("the captcha has been filled");
     }else{
           //not validated or not clicked
           alert("Please fill the captcha!");
     }
}

它会起作用。

Answer 2

将 data-callback 添加到您的 ReCapthca div:

<div class="g-recaptcha" data-sitekey="***" data-callback="recaptchaCallback"></div>

将此函数添加到您的代码中。

var recaptchachecked;
function recaptchaCallback() {
    //If we managed to get into this function it means that the user checked the checkbox.
    recaptchachecked = true;
}

您现在可以在 OnSubmit() 函数上使用 recaptchachecked。