jquery - jQuery 验证动态创建的 reCaptcha 表单

Question

我正在使用此验证表单：

$(document).ready(function() {
    $('form.brochure_form').validate();
});

我目前正在使用它动态创建不可见的recaptcha（这无需验证即可工作）。

function onloadCallback() {
    var count = 1;

    $(".g-recaptcha").each(function() {
        var object = $(this);
        var theid = object.attr('id');      
        var widgetID = "recaptcha_" + count;
        grecaptcha.render("recaptcha_" + count, {
            "sitekey" : "SITEKEY",
            "callback" : function(token) {


                object.parents('form').find(".g-recaptcha-response").val(token);

                // VALIDATE HERE
                if(object.parents('form').valid() == true){
                    object.parents('form').submit();
                } else {
                    grecaptcha.reset(widgetID);

                };
            }
        });
        count++;

    });
}

目前这就是它的工作原理；

1. 使用 reCaptcha 验证表单
2. 表单运行 jQuery 验证
3. 提交

问题是如果表单验证 #1 然后在 #2 上失败，我需要重置 reCaptcha 以再次执行此操作（这是我正在努力的地方，因为我无法正确传递 widgetID - 如果我将此留空，它适用于第一个仅限表格）

我的理想方案是切换#1 和#2，但我也无法正常工作。

此外，上述内容目前返回

Uncaught (in promise) null

这是供参考的 HTML（删除了所有字段，因为它是一个相当大的表单）

<form id="form--brochure1" class="brochure_form " action="" method="post">
    <input type="submit" value="Submit" class="g-recaptcha" id="recaptcha_1" data-badge="inline">
</form>

<form id="form--brochure2" class="brochure_form " action="" method="post">
    <input type="submit" value="Submit" class="g-recaptcha" id="recaptcha_2" data-badge="inline">
</form>

该页面只是在提交时刷新，但我正在执行服务器端验证，如下所示：

if(isset($_POST['g-recaptcha-response'])) {

$secretKey = 'SECRETKEY';
$response = $_POST['g-recaptcha-response'];
$remoteIp = $_SERVER['REMOTE_ADDR'];

$reCaptchaValidationUrl = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=$secretKey&response=$response&remoteip=$remoteIp");
$result = json_decode($reCaptchaValidationUrl, TRUE);


  if($result['success'] == 1) {
     // EMAIL SENT, DATABASE UPDATED ETC HERE
   }
}

标签： jqueryjquery-validaterecaptchainvisible-recaptcha