谷歌用jquery标签页重述并验证won';t仅发送site_key


Google recaptcha with jquery tabs and validate won't send site_key only

我有一个非常复杂的5种形式的场景。我使用带有ajax的jQuery选项卡来加载表单(外部html文件)。

我还使用jQueryvalidate进行了一些表单验证。

最后,一切都在工作,除了,我没有"g-repatcha-response"的帖子。

这是我的索引文件:

<head>
    <script type="text/javascript">
        $(function() {
            $( "#forms").tabs({
                beforeLoad: function( event, ui ) {
                    ui.jqXHR.fail(function() {
                        ui.panel.html(
                                "Couldn't load this form. We'll try to fix this as soon as possible. "
                        );
                    });
                },
                active: false
            });
        });
    </script>
</head>
<body>
<div id="forms" class="contactsHub">
    <ul class="contactsHubList">
        <li><a href="forms/form1.html">Form 1</a></li>
        <li><a href="forms/form2.html">Form 2</a></li>
        <li><a href="forms/form3.html">Form 3</a></li>
        <li><a href="forms/form4.html">Form 4</a></li>
        <li><a href="forms/form5.html">Form 5</a></li>
    </ul>
</div>
</body>

我的一个表单文件:

    <script type="text/javascript">
    jQuery("#newsletter_form").validate({
        onkeyup: false,
        rules: {
            full_name_5: "required",
            email_5: {
                required: true,
                email: true
            }
        },
        messages: {
            full_name_5: "Please enter your Full Name.",
            email_5: "Please enter a valid email address."
        },
        submitHandler: function (form) {
            jQuery("#wait").show();
            setTimeout(function(){
                form.submit();
            }, 5);
        }
    });
    var CaptchaCallback = function(){
        grecaptcha.render('RecaptchaField5', {
            'sitekey' : 'my_key'
        });
    };
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&amp;render=explicit" async defer></script>
<div class="tabContent tabContent5">
    <form id="newsletter_form" method="post" action="grab.php">
        <ul>
            <h2 title="Newsletter">Newsletter</h2>
            <input type="hidden" name="form_name" id="form_name" value="Newsletter Signup">
            <li>
                <label>Full Name *</label>
                <input name="full_name_5" id="full_name_5" type="text" placeholder="Full Name *">
            </li>
            <li>
                <label>Email *</label>
                <input name="email_5" id="email_5" type="text" placeholder="Email *">
            </li>
            <li class="recaptchaWrapper">
                <div id="RecaptchaField5"></div>
            </li>
            <li class="submitForm">
                <input name="submit_5" value="Sign Up Now" id="submit_5" class="submitButton" type="submit">
            </li>
        </ul>
    </form>
</div>

还有我的grab.php

 // your secret key
$secret = "my_secret";
// empty response
$response = null;
// check secret key
$reCaptcha = new ReCaptcha($secret);
// if submitted check response
if ($_POST["g-recaptcha-response"]) {
    $response = $reCaptcha->verifyResponse(
        $_SERVER["REMOTE_ADDR"],
        $_POST["g-recaptcha-response"]
    );
}
if ($response != null && $response->success) {
    echo "Hi " . $_POST["name"] . " (" . $_POST["email"] . "), thanks for submitting the form!";
    foreach ($_POST as $key => $value) {
        echo '<p><strong>' . $key.':</strong> '.$value.'</p>';
    }
}
else {
    foreach ($_POST as $key => $value) {
        echo '<p><strong>' . $key.':</strong> '.$value.'</p>';
}

所以我得到的是一个空的$_POST["g-repatcha-response"]

任何帮助都将不胜感激!

这将以$_POST["g-recaptcha-response"] 的形式发送POST

  <div class="g-recaptcha" data-sitekey="site key"></div>

<html>
  <head>
    <title>Google recaptcha</title>
    <script src='https://www.google.com/recaptcha/api.js'></script>
  </head>
  <body>
    <h1>Google RECAPTCHA Demo</h1>
    <form id="x_form" action="form.php" method="post">
      <input type="email" placeholder="email" size="40"><br><br>
      <textarea name="comment" rows="8" cols="39"></textarea><br><br>
      <input type="submit" name="submit" value="Post comment"><br><br>
      <div class="g-recaptcha" data-sitekey="site key ==="></div>
    </form>
  </body>
</html>