javascript - 使用 Jquery 进行谷歌 recaptcha 验证

Question

我有兴趣在用户勾选并验证 google recaptcha 后立即隐藏 resultcaptcha 消息。只有第一部分 (v.length== 0) 有效。否则，如果不起作用。你可以在这里查看表格:https://csandreas1.herokuapp.com

if(grecaptcha.getResponse() == 0) // this works
    {
        $('#resultcaptcha').show();
        $('#resultcaptcha').html('<i class="fa fa-exclamation-circle w3-text-red fa-3x" aria-hidden="true"></i> <span class="w3-text-white w3-bold" style="font-size:16px"> Please verify that you are a human</span>');
    }
    else if(grecaptcha.getResponse() == 1)//this doesn't work
    {
        $('#resultcaptcha').hide();
        $('#resultcaptcha').html('');
    }

    else{//submit the form}

Answer 1

上面的代码在表单 submit 事件处理程序中，只有在单击“提交”(SEND) 按钮时才会触发。

要在验证码验证后立即隐藏错误消息，您需要在验证码元素上使用 data-callback (class="g-recaptcha"), 顾名思义，它提供了一个在验证码验证成功时执行的回调。这是 documentation link .

代码应该是这样的。 (我无法使用 data-callback 属性验证代码，但它确实适用于 grecaptcha.render() 方法)

<script>
     function captcha_callback(response) {
        if (response.length > 1) {
            $('#resultcaptcha').html('');
        }
    }
</script>

<div class="g-recaptcha" data-sitekey="site_key" data-callback="captcha_callback"><div>

另外，如果你想重新设置验证码，比如在提交成功后清除表单，你可以使用:(参见Documentation)

grecaptcha.reset()