感谢您提前提供帮助，我的任务是在此表格上用相对较新的隐形重新CAPTCHA替换标准的Google重新验证，同时保持成功/不是
上的所有消息
<script type="text/javascript">
var sib_prefix = 'sib';
var sib_dateformat = 'mm-dd-yyyy';
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit&hl=en"></script>
<script>
var verifyCallback = function(response) {
if(response.length > 0) {
$(".captcha > div.row > div.message_area").remove();
}
};
var myCallBack = function() {
//Render the recaptcha1 on the element with ID "recaptcha1"
if($('.captcha > div.row > div#gcaptcha').length > 0) {
var captcha = grecaptcha.render('gcaptcha', {
'sitekey' : '6LfF6yMUAAAAAFtaUVQkV8p-fG4ZDCxnrKQMiB1b',
'theme' : 'light',
'callback' : verifyCallback,
});
}
};
</script>
<script type='text/javascript' src='https://my.sendinblue.com/public/theme/version4/assets/js/src/subscribe-validate.js?v=1500542426'></script><!-- SendinBlue Signup Form HTML Code --><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<style>
</style>
<link rel="stylesheet" href="https://my.sendinblue.com/public/theme/version4/assets/styles/style.css" />
<div id="sib_embed_signup" style="padding: 10px;">
<div class="forms-builder-wrapper" style="position:relative;margin-left: auto;margin-right: auto;">
<input type="hidden" id="sib_embed_signup_lang" value="en">
<input type="hidden" id="sib_embed_invalid_email_message" value="That email address is not valid. Please try again.">
<input type="hidden" name="primary_type" id="primary_type" value="email">
<div id="sib_loading_gif_area" style="position: absolute;z-index: 9999;display: none;">
<img src="https://my.sendinblue.com/public/theme/version4/assets/images/loader_sblue.gif" style="display: block;margin-left: auto;margin-right: auto;position: relative;top: 40%;">
</div>
<form class="description" id="theform" name="theform" action="https://my.sendinblue.com/users/subscribeembed/js_id/2scv0/id/6" onsubmit="return false;">
<input type="hidden" name="js_id" id="js_id" value="2scv0"><input type="hidden" name="listid" id="listid" value="14"><input type="hidden" name="from_url" id="from_url" value="yes"><input type="hidden" name="hdn_email_txt" id="hdn_email_txt" value="">
<div class="sib-container rounded">
<input type="hidden" name="req_hid" id="req_hid" value="~Captcha" style="font-size: 13px;">
<div class="header" style="padding:0 20px;">
</div>
<div class="view-messages" style=" margin:5px 0;"> </div>
<!-- an email as primary -->
<div class="primary-group email-group forms-builder-group ui-sortable" style="">
<div class="row mandatory-email" style="padding: 10px 20px; position: relative; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-size: 17px;">
<div class="lbl-tinyltr" style="clear: both; float: none; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;">Enter your email address to subscribe. <red style="color:#ff0000;">*</red></div>
<input type="text" name="email" id="email" value="" style="padding: 10px 4px; width: 90%; min-width: auto;">
<div style="clear:both;"></div>
<div class="hidden-btns">
<a class="btn move" href="#"><i class="fa fa-arrows"></i></a><br>
<!--<a class="btn btn-danger delete" href="#"><i class="fa fa-trash-o fa-inverse"></i></a>-->
</div>
</div>
</div>
<div class="captcha forms-builder-group"><div class="row" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-size: 17px; padding: 10px 20px;"><div id="gcaptcha" style="transform: scale(1); margin-left: 0px;"></div></div></div>
<!-- end of primary -->
<div class="byline" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-weight: bold; font-size: 16px; text-align: center; display: block;">
<button class="button editable " type="submit" data-editfield="subscribe" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(255, 255, 255); background: rgb(5, 5, 5); display: inline-block; white-space: nowrap; min-height: 40px; margin: 0px 5px 0px 0px; padding: 0px 22px; text-decoration: none; text-transform: uppercase; text-align: center; font-weight: bold; font-style: normal; font-size: 14px; cursor: pointer; border: 0px; border-radius: 4px; vertical-align: top; height: auto; line-height: 150%;">Subscribe</button></div>
<div style="clear:both;"></div>
</div>
</form>
</div>
</div>
<!-- End : SendinBlue Signup Form HTML Code -->
提交。
这是Google提供的文档https://developers.google.com/recaptcha/docs/invisible
如果有人知道如何解决这个问题，请告诉我如何解决。
另请注意，我将Stackoverflow.com添加到我的验证码sitekey可以使用的网站列表中。
非常欣赏
<script type="text/javascript">
var sib_prefix = 'sib';
var sib_dateformat = 'mm-dd-yyyy';
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit&hl=en"></script>
<script>
var verifyCallback = function(response) {
if(response.length > 0) {
$(".captcha > div.row > div.message_area").remove();
}
};
var myCallBack = function() {
//Render the recaptcha1 on the element with ID "recaptcha1"
if($('.captcha > div.row > div#gcaptcha').length > 0) {
var captcha = grecaptcha.render('gcaptcha', {
'sitekey' : '6LfF6yMUAAAAAFtaUVQkV8p-fG4ZDCxnrKQMiB1b',
'theme' : 'light',
'callback' : verifyCallback,
});
}
};
</script>
<script type='text/javascript' src='https://my.sendinblue.com/public/theme/version4/assets/js/src/subscribe-validate.js?v=1500542426'></script><!-- SendinBlue Signup Form HTML Code --><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<style>
div#sib_embed_signup .needsfilled input {border-color: #B94A48 !important; color: #B94A48 !important;}
div#sib_embed_signup .needsfilled {color: #B94A48 !important;}
div#sib_embed_signup input[type="text"] {border: 1px solid #CCCCCC;border-radius: 4px;-moz-border-radius: 4px;-webkit-border-radius: 4px;}
div#sib_embed_signup div.message_area {position: relative;padding: 10px 30px 10px 10px; margin: 0px 0px 10px 0px;font-size:14px; border-radius: 5px;-webkit-border-radius: 5px; -moz-border-radius: 5px;box-sizing: border-box;}
div#sib_embed_signup div.message_area button.close {position: absolute;right: 8px;top: 8px;color: inherit;background: 0 0;border: 0;padding: 0px;-webkit-appearance: none;cursor: pointer;font-weight: bold;font-size: 14px;}
.tipicon{cursor: pointer;padding: 3px 7px;font-size: 12px;font-weight: bold;line-height: 1.2;color: #fff;text-align: center;vertical-align: baseline;background-color: #999;border-radius: 10px;text-decoration: none;}
.tooltip{display: inline;position: absolute;left: 97%;}
.tooltip:hover:after{background: #333;background: rgba(0,0,0,.8);border-radius: 5px;color: #fff;content: attr(data-title);right: -2px;bottom: 26px;padding: 5px 15px;position: absolute;z-index: 98;width: 220px;}
.tooltip_small:hover:after{padding: 5px 5px; width: 150px;}
.tooltip:hover:before{border: solid;border-color: #333 transparent;border-width: 6px 6px 0 6px;bottom: 20px;content: "";left: 1px;position: absolute;z-index: 99;}
.sib-dropdown-menu.flag-icon {display: none;height: 100px;overflow-x: hidden;min-width: 160px;font-size: 13px;list-style: none;padding-left:14px;border:1px solid rgba(0,0,0,.15);background: white;border-radius: 4px;margin-top:10px;}
.sib-dropdown-menu.flag-icon li a{display: block;white-space: nowrap;text-decoration: none;color: rgba(0,0,0,0.87);box-shadow: none;}
.sms_field .country-block{margin-right: 3px !important;float: left;width:56px;}
.icon-arrow{display: inline-block;width:0px;height: 0px;margin-left:2px;margin-top:5px;border-top:4px dashed;border-right:4px solid transparent;border-left:4px solid transparent;vertical-align: text-top;}
.sib-dropdown-toggle.country-flg{display: inline-block;font-size: 13px;}
body {background-Image: url('');}
body {background-color: #ffffff;}
div#sib_embed_signup .sib-container {background: rgba(255,255,255,1);}
div#sib_embed_signup .sib-container h1 {font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;}
div#sib_embed_signup h1.title {font-size: 45px;}
div#sib_embed_signup .sib-container .forms-builder-footer, div#sib_embed_signup .sib-container .description, div#sib_embed_signup .sib-container .fake-label, div#sib_embed_signup .sib-container .row, div#sib_embed_signup .sib-container #company-name{font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;}
div#sib_embed_signup .forms-builder-footer,div#sib_embed_signup div.description,div#sib_embed_signup .fake-label,div#sib_embed_signup .row {font-size: 17px;}
div#sib_embed_signup .sib-container .button {font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;}
div#sib_embed_signup .button{font-size: 14px;}
div#sib_embed_signup input {font-size: 13px;}
div#sib_embed_signup .sib-containter h1 {color: #232323;}
div#sib_embed_signup .sib-container {color: #343434;}
div#sib_embed_signup .sib-container .button{color: #ffffff;}
div#sib_embed_signup .sib-container .button{background: #0f2b5d;}
div#sib_embed_signup .forms-builder-wrapper{ max-width: 540px;}
div#sib_embed_signup .sib-container{ padding: 40px 20px 20px;}
div#sib_embed_signup .header{ padding: 0 20px;}
div#sib_embed_signup h1.title{ lineHeight: 50px;}
div#sib_embed_signup h3.company-name{ lineHeight: 35px;}
div#sib_embed_signup div.description{ padding: 0 20px 15px;}
div#sib_embed_signup div.row{ padding:10px 20px; }
div#sib_embed_signup input[type=text]{ padding: 10px 4px;width:100% !important;box-sizing: border-box;}
</style>
<link rel="stylesheet" href="https://my.sendinblue.com/public/theme/version4/assets/styles/style.css" />
<div id="sib_embed_signup" style="padding: 10px;">
<div class="forms-builder-wrapper" style="position:relative;margin-left: auto;margin-right: auto;">
<input type="hidden" id="sib_embed_signup_lang" value="en">
<input type="hidden" id="sib_embed_invalid_email_message" value="That email address is not valid. Please try again.">
<input type="hidden" name="primary_type" id="primary_type" value="email">
<div id="sib_loading_gif_area" style="position: absolute;z-index: 9999;display: none;">
<img src="https://my.sendinblue.com/public/theme/version4/assets/images/loader_sblue.gif" style="display: block;margin-left: auto;margin-right: auto;position: relative;top: 40%;">
</div>
<form class="description" id="theform" name="theform" action="https://my.sendinblue.com/users/subscribeembed/js_id/2scv0/id/1" onsubmit="return false;">
<input type="hidden" name="js_id" id="js_id" value="2scv0"><input type="hidden" name="listid" id="listid" value="2"><input type="hidden" name="from_url" id="from_url" value="yes"><input type="hidden" name="hdn_email_txt" id="hdn_email_txt" value="">
<div class="sib-container rounded">
<input type="hidden" name="req_hid" id="req_hid" value="~Captcha" style="font-size: 13px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;">
<div class="header" style="padding: 0px 20px;">
<h1 class="title editable" data-editfield="newsletter_name" style="font-weight: normal; text-align: left; font-size: 45px; margin-bottom: 2px; padding: 0px; margin-top: 0px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(35, 35, 35); display: none;">My Newsletter</h1>
<h3 id="company-name" style="font-weight: normal; text-align: left; font-size: 25px; margin-bottom: 12px; padding: 0px; margin-top: 0px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); display: none;">By</h3>
</div>
<div class="description editable" data-editfield="newsletter_description" style="padding: 0px 20px 15px; border-bottom: 1px solid rgb(204, 204, 204); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-size: 17px; display: none;">What type of content do you plan to share with your subscribers? </div>
<div class="view-messages" style=" margin:5px 0;"> </div>
<!-- an email as primary -->
<div class="primary-group email-group forms-builder-group ui-sortable" style="">
<div class="row mandatory-email" style="padding: 10px 20px; position: relative; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-size: 17px;">
<div class="lbl-tinyltr" style="clear: both; float: none; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;">Enter your email address to subscribe. <red style="color:#ff0000;">*</red></div>
<input type="text" name="email" id="email" value="" style="padding: 10px 4px; width: 90%; min-width: auto;">
<div style="clear:both;"></div>
<div class="hidden-btns">
<a class="btn move" href="#"><i class="fa fa-arrows"></i></a><br>
<!--<a class="btn btn-danger delete" href="#"><i class="fa fa-trash-o fa-inverse"></i></a>-->
</div>
</div>
</div>
<div class="captcha forms-builder-group" style="display: block;"><div class="row" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-size: 17px; padding: 10px 20px;"><div id="gcaptcha" style="transform: scale(1); margin-left: 0px;"></div></div></div>
<!-- end of primary -->
<div class="byline" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(52, 52, 52); font-weight: bold; font-size: 16px; text-align: center; display: block;">
<button class="button editable " type="submit" data-editfield="subscribe" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: rgb(255, 255, 255); background: rgb(15, 43, 93); display: inline-block; white-space: nowrap; min-height: 40px; margin: 0px 5px 0px 0px; padding: 0px 10px; text-decoration: none; text-transform: uppercase; text-align: center; font-weight: bold; font-style: normal; font-size: 14px; cursor: pointer; border: 0px; border-radius: 4px; vertical-align: top; height: auto; line-height: 150%;">Subscribe</button></div>
<div style="clear:both;"></div>
</div>
</form>
</div>
</div>
<!-- End : SendinBlue Signup Form HTML Code -->