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

如果您可以准备或查找图像创建者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 2

只是更新Mohit Jain的代码

 $(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 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();
         }
            });

使用jquery验证验证码

3 个答案: