试图让验证码旁边我的验证

Question

工作，我已经成功地验证使用JS我的文本框，但知道我需要允许的验证码，旁边的验证工作。

<script> 
    function validateForm() { 
    var x = document.forms["reg"]["User"].value; 
    var letters = "@"; 
    if (x.match(letters)) 
    { 
    alert("Can't Have Email Address As USERNAME!"); 
     return false; 
     } 

     return true; 


    } 

第一形式

 <form name="reg" action="DBLogin.php" onsubmit="return validateForm()" method="post"> 

验证码：

<form action="validate.php" method="post"> 
     Enter Image Text 
     <input name="captcha" type="text"> 
     <img src="captcha.php" /><br> 
     <input name="submit" type="submit" value="Register"> 
     </form> 

有有验证码的工作我一起JS验证的一种方式？

谢谢

Answer 1

使用ajax验证验证码。当他提交表单时发送一个ajax请求来验证验证码。

给一个只验证码形式提交按钮。

<form id ="captcha-form" > 
 
     Enter Image Text 
 
     <input name="captcha" type="text"> 
 
     <img src="captcha.php" /><br> 
 
     <input name="submit" type="submit" value="Register"> 
 
</form>

主要形式：

<form id="main-form" name="reg" action="DBLogin.php" method="post"> 
 
    <!-- this shoulnt have an submit button -->

现在使用一个js代码首先验证验证码和验证形式

$("#captcha-form").submit(function(event){ 
 
    
 
    // setup some local variables 
 
    var $form = $(this); 
 
    // let's select and cache all the fields 
 
    var $inputs = $form.find("input, select, button, textarea"); 
 
    // serialize the data in the form 
 
    var serializedData = $form.serialize(); 
 

 
    // let's disable the inputs for the duration of the ajax request 
 
    // Note: we disable elements AFTER the form data has been serialized. 
 
    // Disabled form elements will not be serialized. 
 
    $inputs.prop("disabled", true); 
 

 
    // fire off the request to /form.php 
 
    request = $.ajax({ 
 
     url: "validate.php", 
 
     type: "post", 
 
     data: serializedData 
 
    }); 
 

 
    // callback handler that will be called on success 
 
    request.done(function (response, textStatus, jqXHR){ 
 
     if(response == "true") 
 
      { 
 
      validateform(); 
 
      } 
 
    }); 
 

 
    // callback handler that will be called on failure 
 
    request.fail(function (jqXHR, textStatus, errorThrown){ 
 
     // handle error 
 
     
 
    }); 
 

 
    // callback handler that will be called regardless 
 
    // if the request failed or succeeded 
 
    request.always(function() { 
 
     // reenable the inputs 
 
     $inputs.prop("disabled", false); 
 
    }); 
 

 
    // prevent default posting of form 
 
    event.preventDefault(); 
 
});

现在验证功能

function validateForm() { 
 
    var x = document.forms["reg"]["User"].value; 
 
    var letters = "@"; 
 
    if (x.match(letters)) 
 
    { 
 
    alert("Can't Have Email Address As USERNAME!"); 
 
     
 
     } 
 

 
     $("#main-form").submit(); 
 

 

 
    }

如RiggsFolly指出这是不推荐。因为这会挫败验证码的目的。