如果验证码成功，则启用回调按钮(谷歌验证码 v2)

>我有一个简单的页面，其中包含一个链接变量的按钮，我想向页面添加验证码验证，其中按钮只有在验证验证码时才可见

<a id="cl-link" class="cl-link-button" href="<?php echo esc_url($url); ?>" rel="nofollow"><span></span></a>

完整代码：

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
    <head>
        <meta charset="<?php bloginfo('charset'); ?>" />
        <meta name="robots" content="noindex">
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
		<script src='https://www.google.com/recaptcha/api.js'></script>
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
        <link rel='stylesheet' id='link-single'  href='<?php echo DOO_URI,'/css/cl.css'; ?>' type='text/css' media='all' />
    </head>
    <body>  
	
	
    <a id="cl-link" class="cl-link-button" href="<?php echo esc_url($url); ?>" rel="nofollow"><span></span></a>
	
	
	
	</body>
</html>

如果使用 Javascript 渲染 Recaptcha 组件，则会在成功验证 Recaptcha 后触发一个函数。

因此，对于 Recaptcha v3：

<script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>
<script>
  grecaptcha.ready(function() {
      grecaptcha.execute('reCAPTCHA_site_key', {action: 'homepage'}).then(function(token) {
         $("#cl-link").show();
      });
  });
</script>

或者，如果您使用的是 Recaptcha v2 和 html，则有一个属性data-callback用于向组件添加回调函数。

<div class="g-recaptcha" data-callback="recaptcha_callback" data-sitekey="xxxxx"></div>

在你的 Javascript 中：

<script type="text/javascript">
    function recaptcha_callback(){
      $('#cl-link').show();
    }
</script>

我假设您的网页中有 JQuery 用于显示按钮。如果没有，您应该使用本机Javascript来显示按钮。

相关内容

最新更新

热门标签：