必要に応じてReCaptchaフィールド

Question

formにrecaptchaを使用しようとしていますが、requiredに設定するのは問題です。私はthis質問の最初の2つの回答のコードを使用しようとしましたが、いずれも働いていませんでした。ここで

は私headerコードです：

<form action="some-page.php"> 
    <fieldset> 
     <legend>Personal information:</legend> 
     First name:<br> 
     <input type="text" name="firstname" value="Name" required><br> Last name:<br> 
     <input type="text" name="lastname" value="Last Name" required><br><br> 
    <div class="g-recaptcha" data-sitekey="xxxx"></div> 
     <input type="hidden" name="recaptcha" data-rule-recaptcha="true"> 
     <input type="submit" value="Submit"> 
    </fieldset> 
</form> 

<script> 
    $('form').validate({ 
     ignore: '.no-validation' 
    }); 

    // Add our validation method for reCaptcha: 
    $.validator.addMethod("recaptcha", function(value, element) { 
     var grecaptcha = window.grecaptcha || null; 
     return !grecaptcha || grecaptcha.getResponse(); 
    }, "Please fill reCAPTCHA"); 
</script> 

Answer 1

function validateForm() { \t 
 
    var recaptcha = document.forms["myForm"]["g-recaptcha-response"].value; 
 
    if (recaptcha == "") { 
 
     alert("Please fill reCAPTCHA"); 
 
     return false; 
 
    } 
 
}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> 
 
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script> 
 
<script src="https://www.google.com/recaptcha/api.js"></script> 
 

 

 

 
<form name="myForm" action="login.php" onsubmit="return validateForm()" method="post"> 
 
    <fieldset> 
 
     <legend>Personal information:</legend> 
 
     First name:<br> 
 
     <input type="text" name="firstname" value="Name" required><br> Last name:<br> 
 
     <input type="text" name="lastname" value="Last Name" required><br><br> 
 
    <div class="g-recaptcha" data-sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"></div> 
 
     <input type="hidden" name="recaptcha" data-rule-recaptcha="true"> 
 
     <input type="submit" value="Submit"> 
 
    </fieldset> 
 
</form>