如何使用Javascript验证reCAPTCHA客户端

时间:2017-07-11 16:03:30

标签: javascript recaptcha

我有一个位于html文件中的表单。我正在尝试添加一个reCAPTCHA复选框。我显然希望reCAPTCHA正常工作,同时成为表单验证代码的一部分。这意味着,除非选中reCAPTCHA,否则我不希望提交表单。这是我的代码:

    <form method="post" name="myemailform" action="pricingForm.php" onsubmit="return validateform();">
    <label for='sqft'>Estimated Quantity Needed: <span style="color: #f00;">*</span></label><br>
        <input type="text" name="sqft" size="5%"></li>
        <li>
        <label for='Units'>Units <span style="color: #f00;">*</span></label><br>
        <select name="Units" >
        <option value="000">(select one)</option>
        <option value="Each">Each</option>
        <option value="SQFT">SQ.FT.</option></select></li><br />
        <li>
        <label for='comments'>Comments</label> <br>
        <textarea  style="width: 500px; height: 150px;" name="comments"></textarea></li><br /><br />

        <li><div class="g-recaptcha" id="rcaptcha" data-sitekey="6LfdmSgUAAAAADxP1JYxU68gxYjCXEZNH2z0uS9f"> </div>
</li>

    <div class="small_container_left">      
    <input class="btn" type="submit" name='submit' id="btn-validate" value="Submit To Merge" size="100%"></div></form>

    <div class="small_container_right">
        <button class="closeButton" onclick="location.href='#body';">Back To <span style="font-family:raleway-bold;">extreme</span><span style="font-family:raleway-semi">concrete</span><span style="font-size: 13px;"><sup>™</sup></span> Page</button></a></div>

<script language="JavaScript" type="text/javascript"
xml:space="preserve">
var frmvalidator  = new Validator("myemailform");
frmvalidator.EnableMsgsTogether();
frmvalidator.addValidation("project","req","Enter the name of your project");
frmvalidator.addValidation("phoneNumber","req","Enter your phone number");
frmvalidator.addValidation("phoneNumber","maxlen=10","Enter a valid phone number");
frmvalidator.addValidation("phoneNumber","minlen=10","Enter a valid phone number");
frmvalidator.addValidation("phoneNumber","numeric","Enter a valid phone number");
frmvalidator.addValidation("projectLocation","req","Enter your project location");
frmvalidator.addValidation("color","dontselect=000","Please select a color");
frmvalidator.addValidation("Units","dontselect=000","Please select a unit");
frmvalidator.addValidation("projectType","dontselect=000","Please select the type of project");
frmvalidator.addValidation("material","dontselect=000","Please select a material");
frmvalidator.addValidation("sqft","req","Please enter your estimated quantity");
frmvalidator.addValidation("creating","dontselect=000","Please tell us what you want to create");
frmvalidator.addValidation("company","req","Enter your name");
frmvalidator.addValidation("email1","req","Enter a valid email address");
frmvalidator.addValidation("email1","email","Enter a valid email address");
frmvalidator.addValidation("web","req","Please enter your company website");
frmvalidator.setAddnlValidationFunction(DoCustomValidation);

$( '#btn-validate' ).click(function DoCustomValidation(){
  var $captcha = $( '#rcaptcha' ),
      response = grecaptcha.getResponse();

  if (response.length === 0) {
    $( '.msg-error').text( "reCAPTCHA is mandatory" );
    if( !$captcha.hasClass( "error" ) ){
      $captcha.addClass( "error" );
       alert('You did not check the reCAPTCHA!' );

    }
  } else
  {
    return true;
  }


});




</script><br />

0 个答案:

没有答案