Javascript 如何检查用户已选中 Google recaptcha 中的复选框的 js?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/28674946/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to check in js that user has checked the checkbox in Google recaptcha?
提问by Hello Universe
I have added the following before end of head
我在头部结束前添加了以下内容
<script src='https://www.google.com/recaptcha/api.js'></script>
I have added this before end of form
我在表格结束前添加了这个
<div class="g-recaptcha" data-sitekey="== xxxxxx =="></div>
I can see the recaptcha similar to https://developers.google.com/recaptcha/
我可以看到类似于https://developers.google.com/recaptcha/的 recaptcha
HOwever, when user presses data without checking the checkbox, the data is submitted. Is there any other code I need to add to check if user has pressed the checkbox? Hopefully in js?
然而,当用户在没有选中复选框的情况下按下数据时,数据被提交。我是否需要添加任何其他代码来检查用户是否按下了复选框?希望在js中?
回答by slinky2000
Google has a call back option for when the checkbox is checked.
当复选框被选中时,谷歌有一个回调选项。
Add this to your form element:
将此添加到您的表单元素中:
data-callback="XXX"
Example:
例子:
<div class="g-recaptcha" data-callback="recaptchaCallback" data-sitekey="== xxxxxx =="></div>
And a disable attribute to your submit button.
以及提交按钮的禁用属性。
Example:
例子:
<button id="submitBtn" disabled>Submit</button>
Then a create a callback function and write whatever code you need.
然后创建一个回调函数并编写您需要的任何代码。
Example:
例子:
function recaptchaCallback() {
$('#submitBtn').removeAttr('disabled');
};
回答by Olafur Tryggvason
You can also call the grecaptcha object to check. grecaptcha.getResponse();is empty when unchecked and has the verification code when checked.
您也可以调用 grecaptcha 对象进行检查。grecaptcha.getResponse();未勾选时为空,勾选时为验证码。
grecaptcha.getResponse().length === 0when unchecked
grecaptcha.getResponse().length === 0未选中时
function isCaptchaChecked() {
return grecaptcha && grecaptcha.getResponse().length !== 0;
}
if (isCaptchaChecked()) {
// ...
}
回答by MUSTAPHA GHLISSI
To check if google recaptchais checked or not you can do it by the following code :
要检查是否检查了google recaptcha,您可以通过以下代码进行:
<script>
if(grecaptcha && grecaptcha.getResponse().length > 0)
{
//the recaptcha is checked
// Do what you want here
alert('Well, recaptcha is checked !');
}
else
{
//The recaptcha is not cheched
//You can display an error message here
alert('Oops, you have to check the recaptcha !');
}
</script>
回答by Manish Vadher
To check if google recaptcha v2is checked or not you can do it by the following code :
要检查是否检查了google recaptcha v2,您可以通过以下代码进行:
var checkCaptch = false;
var verifyCallback = function(response) {
if (response == "") {
checkCaptch = false;
}
else {
checkCaptch = true;
}
};
$(document).ready(function() {
$("#btnSubmit").click(function() {
if (checkCaptch && grecaptcha.getResponse()!="") {
//Write your success code here
}
});
})
回答by halfbit
Let the browser do the job for you! (based on slinky2000 answer)
让浏览器为您完成工作!(基于 slinky2000 答案)
note:this is only to prevent sending an 'accidentally' unchecked recaptcha. You still have to verify the recaptcha on server sidebecause a bot does not care ...
注意:这只是为了防止发送“意外”未经检查的验证码。您仍然需要在服务器端验证 recaptcha,因为机器人不在乎......
Add a an invisible input tag with required=trueattribute just below the div.g-recaptcha.
添加一个不可见的输入标签,其required=true属性就在div.g-recaptcha.
<input id='recaptcha_check_empty' required tabindex='-1',
style='width:50px; height:0; opacity:0; pointer-events:none;
position:absolute;
bottom:0;'>
Enclose both width a divwith position=relative;to point the bottom:0;above to the bottom of recaptcha.
将两个宽度 a 括div起来position=relative;以将bottom:0;上方指向recaptcha 的底部。
Now the Browser asks nicely to fill out this field - pointing to the recapcha.
现在浏览器很好地要求填写此字段 - 指向 recapcha。
Now we need the callback:
现在我们需要回调:
<div class="g-recaptcha" data-callback="recaptchaCallback" ...
and
和
function recaptchaCallback() {
$('#recaptcha_check_empty').val(1);
}

