我在表单上实现隐形reCAPTCHA时遇到了麻烦,因为我需要先运行默认表单验证 .

我已经成功地解决了一个小问题 - 当你填写表格并点击提交时,它会在页面上提交另一个表格!你必须再次提交它才能工作!

我已经检查过没有名字或身份证的冲突,但我不知所措 .

有任何想法吗?它在网页的底部:https://www.podeals.com/iona

您将看到,当您点击提交时,它也提交Mailchimp注册表单:(

这是我的代码;

<script src='https://www.google.com/recaptcha/api.js' async defer></script>
<form action="/cgi-bin/mailer.pl" id="iona-enquiry" method="post" target="_self" name="iona-enquiry">
    <div class="nx-row">
        <div class="nx-c4">
            <label for="">Title</label>
            <span class="nx-select basket-wrap">
                <select name="title" id="title" class="nx-component nx-select">
                    <option value="" selected>Select</option>
                    <option value="Mr">Mr</option>
                    <option value="Mrs">Mrs</option>
                    <option value="Ms">Ms</option>
                    <option value="Miss">Miss</option>
                </select>
            </span>
        </div>
        <div class="nx-c4">
            <label for="firstname">First Name</label>
            <input type="text" value="" name="firstname" id="firstname" placeholder="First Name" required>
        </div>
        <div class="nx-c4">
            <label for="lastname">Last Name</label>
            <input type="text" value="" name="lastname" id="lastname" placeholder="Last Name" required>
        </div>
    </div>
    <div class="nx-row">
        <div class="nx-c6">
            <label for="email" class="">Email</label>
            <input type="email" name="email" id="email" placeholder="Enter email" class="nx-required" required>
        </div>
        <div class="nx-c6">
            <label for="phone" class="">Phone</label>
            <input type="tel" name="call" id="phone" placeholder="Enter Phone Number" class="nx-required" required>
        </div>
    </div>
    <div class="nx-row">
        <div class="nx-c12">
            <div class="recaptcha-center">
<script>
    jQuery('#iona-enquiry').submit(function (event) {
event.preventDefault();
grecaptcha.reset();
grecaptcha.execute();
});

   function formSubmit(response) {
     document.getElementById("iona-enquiry").submit();
   }
 </script>

<div class="g-recaptcha" data-sitekey="6LcccWoUAAAAANCtIyB8fGIwb3BO5H28xDPtsngG" data-callback="formSubmit" data-badge="inline" data-size="invisible"></div>
            </div>

            <input id='submit' type="submit" value="Advance Register" class="nx-btn nx-btn--primary nx-btn--arrowhover">

            <input type="hidden" value="thanks" name="redirect" />
            <input type="hidden" name="mailerid" value="5" />
            <input type="hidden" name="enquiry" id="enquiry" value="Iona Pre Reg" />
            <input type="hidden" name="affiliate" id="affiliate" value="[INC:displayphoneno("201")]" /> 
        </div>
    </div>
</form>