javascript - 无法显式呈现 Google ReCaptcha 并让回调函数正常工作

Question

我正在网站上构建一个表单，并且在提交 ReCaptcha 时遇到运行函数的问题。此函数删除提交按钮上的禁用属性。

也有可能在一个页面上使用多个表单，因此我实现了以下解决方案以允许在一个页面上使用多个验证码表单:

https://stackoverflow.com/a/33535769/2506219

看来我可以允许多个 ReCaptcha 表单或允许提交按钮，但不能同时允许两者。

这是代码:

HTML

<div class="g-recaptcha" data-callback="verifyCallback"></div>     

<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>

JavaScript

<script>

  var CaptchaCallback = function() {
    $('.g-recaptcha')
      .each(function(index, el) {
        grecaptcha.render(el, { 'sitekey': 'XXXX' });
      });
    };

  function verifyCallback() {;
    $('#submitBtn').prop('disabled', false);
  }

</script>

谢谢。

Answer 1

解决了!

我需要从回调中调用该函数，将其放在 HTML 中是行不通的

var CaptchaCallback = function() {
  $('.g-recaptcha')
    .each(function(index, el) {
      grecaptcha.render(el, { 'sitekey': 'XXXX', 'callback': verifyCallback });
  });
 };