使用jquery验证码验证码

Question

我在php中有一个包含验证码的表单。我需要使用jquery验证验证码。如果验证码错误，表单显示提示说验证码已输入错误。请告诉我如何使用jquery验证它。 下面是代码

$(function() { 
    $("#XISubmit").click(function(){ 
var photo= document.forms["XIForm"]["photo"].value; 
if (photo==null || photo=="") { alert("Please Enter captcha"); return false; } 

    document.getElementById("XIForm").submit(); 
     }); 

<div class="formLeft"> 
     <h4>Admission</h4> 

     <form name="XIForm" id="XIForm" method="POST" action="pdf/pdf.php"> 

<label>Security Validation</label> 

    <img src="captcha_image.php" alt=""/> 
    <input type="text" name="photo" maxlength="60" size="30"/> 
<br><br> 

</form> 


captcha_image.php 

<? 
// *** CAPTCHA image generation *** 
// *** http://frikk.tk *** 

session_start(); 

// *** Tell the browser what kind of file is come'n at 'em! *** 
header("Content-Type: image/jpeg"); 

// *** Send a generated image to the browser *** 
die(create_image()); 

// *** Function List *** 
function create_image() 
{ 
    // *** Generate a passcode using md5 
    // (it will be all lowercase hex letters and numbers *** 
    $md5 = md5(rand(0,9999)); 
    $pass = substr($md5, 10, 5); 

    // *** Set the session cookie so we know what the passcode is *** 
    $_SESSION["pass"] = $pass; 

    // *** Create the image resource *** 
    $image = ImageCreatetruecolor(100, 20); 

    // *** We are making two colors, white and black *** 
    $clr_white = ImageColorAllocate($image, 255, 255, 255); 
    $clr_black = ImageColorAllocate($image, 0, 0, 0); 

    // *** Make the background black *** 
    imagefill($image, 0, 0, $clr_black); 

    // *** Set the image height and width *** 
    imagefontheight(15); 
    imagefontwidth(15); 

    // *** Add the passcode in white to the image *** 
    imagestring($image, 5, 30, 3, $pass, $clr_white); 

    // *** Throw in some lines to trick those cheeky bots! *** 
    imageline($image, 5, 1, 50, 20, $clr_white); 
    imageline($image, 60, 1, 96, 20, $clr_white); 

    // *** Return the newly created image in jpeg format *** 
    return imagejpeg($image); 

    // *** Just in case... *** 
    imagedestroy($image); 
} 
?> 

请帮助我，我如何可以验证使用验证码的jQuery

Answer 1

试试这个

$(function() { 
     $("#XISubmit").click(function(){ 
     var photo= document.forms["XIForm"]["photo"].value; 
     var cap = '<?php echo $_SESSION["pass"]; ?>' // try this 
     if (photo==null || photo=="" && photo !==cap) { 
     alert("Please Enter captcha"); return false; 
     } 
     else{ 
     document.getElementById("XIForm").submit(); 
     } 
      }); 

Answer 2

如果你能准备或找到一个图像生成PHP页面，你可以得到图片页

`

// captcha creator 
session_start(); 
$code=rand(1000,9999); 
$_SESSION["code"]=$code; 
$im = imagecreatetruecolor(50, 24); 
$bg = imagecolorallocate($im, 22, 86, 165); //background color blue 
$fg = imagecolorallocate($im, 255, 255, 255);//text color white 
imagefill($im, 0, 0, $bg); 
imagestring($im, 5, 5, 5, $code, $fg); 
header("Cache-Control: no-cache, must-revalidate"); 
header('Content-type: image/png'); 
$captha = imagepng($im); 
imagedestroy($im); 

`

你可以准备一个JS代码并将其放在onClick事件的提交按钮上。然后你会检查与该JS的验证码。

if($_SESSION['captcha'] == $("#form_captcha_text").val()){} 

你会继续

else{ you will use here alert code.} 

Answer 3

刚刚更新莫希特耆那教的代码

$(function() { 
    $("#XISubmit").click(function(){ 
    var photo= document.forms["XIForm"]["photo"].value; 
    var cap = '<?php echo $_SESSION["pass"]; ?>' // try this 
    if (photo==null || photo=="" || photo !=cap) { 
    alert("Please Enter captcha"); return false; 
    } 
    else{ 
    document.getElementById("XIForm").submit(); 
    } 
     });