帶有 jQuery 驗證插件的驗證碼
[英]Captcha with jQuery Validation plugin
問題描述
我正在使用著名的jQuery 驗證插件，我想實現 驗證碼控件。 在他們的演示部分頁面上有，但似乎有一個問題：當您單擊圖像刷新時，它不會刷新！ 這是一個著名的插件，所以我沒有發布代碼，因為有很多 php 文件，也許你們中的許多人已經知道解決方案。 如果需要，我會嘗試發布它們。 謝謝
編輯
// 指數
<?php
// Make the page validate
ini_set('session.use_trans_sid', '0');
// Include the random string file
require 'js/captcha/rand.php';
// Begin the session
session_start();
// Set the session contents
$_SESSION['captcha_id'] = $str;
?>
<form id="form">
<div id="captchaimage">
<a href="" id="refreshimg" title="Click to refresh image">
<img src="js/captcha/images/image.php?<?php echo time(); ?>" width="132" height="46" alt="Captcha image" />
</a>
</div>
<label for="captcha">insert captcha:</label>
<input type="text" maxlength="6" name="captcha" id="captcha" />
// 新會話.php
<?php
// Include the random string file
require 'js/captcha/rand.php';
// Begin a new session
session_start();
// Set the session contents
$_SESSION['captcha_id'] = $str;
?>
// 進程.php
<?php
// Begin the session
session_start();
// To avoid case conflicts, make the input uppercase and check against the session value
// If it's correct, echo '1' as a string
if(strtoupper($_GET['captcha']) == $_SESSION['captcha_id'])
echo 'true';
// Else echo '0' as a string
else
echo 'false';
?>
// rand.php
<?php
// Create a random string, leaving out 'o' to avoid confusion with '0'
$char = strtoupper(substr(str_shuffle('abcdefghjkmnpqrstuvwxyz'), 0, 4));
// Concatenate the random string onto the random numbers
// The font 'Anorexia' doesn't have a character for '8', so the numbers will only go up to 7
// '0' is left out to avoid confusion with 'O'
$str = rand(1, 7) . rand(1, 7) . $char;
?>
//驗證
$("#form").validate({
rules: {
'captcha':{
required: true,
remote: "js/captcha/process.php"
}
},
messages: {
'captcha': "error"
},
onkeyup: false
});
// 腳本刷新驗證碼
$(function(){
$("#refreshimg").click(function(){
$.post('js/captcha/newsession.php');
$("#captchaimage").load('js/captcha/image_req.php');
return false;
});
});
// image_req.php
<?php
// Echo the image - timestamp appended to prevent caching
echo '<a href="" onclick="refreshimg(); return false;" title="Click to refresh image">
<img src="js/captcha/images/image.php?' . time() . '" width="132" height="46" alt="Captcha image" />
</a>';
?>
1 個解決方案
解決方案1
0 2013-03-17 16:22:54
<html>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
.good {color: green;}
.bad {color: red;}
#captcha {
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
user-select: none;
}
</style>
<?php
function background($length = 6) {
$characters = "ABCDEF0123456789";
$string = "#";
for ($p = 0; $p < $length; $p++) {
$string .= $characters[mt_rand(0, strlen($characters) - 1)];}
return $string;
}
$f = background();
function signs($length = 6) {
$characters = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnoprstuvwxyz";
$string = "";
for ($p = 0; $p < $length; $p++) {
$string .= $characters[mt_rand(0, strlen($characters) - 1)];}
return $string;
}
$a = signs();
?>
<script>
$(function() { //run when the document's ready, elements are loaded
$("#refresh").click(function() {
$("#captcha").load(location.href + " #captcha");
});
});
</script>
<script>
$(function() {
$("#send").click(function(evt) {
if ($('#check').val() === $('#verify').val()) {
$("#result").html("<h3 class='good'>Correct</h3>");
evt.preventDefault();
} else {
$("#result").html("<h3 class='bad'>Incorrect</h3>");
evt.preventDefault();
}
});
});
</script>
<head>
<h1>Captcha all in one</h1>
<hr />
</head>
<body>
<div id="captcha" style="height: 50px; width: 125px; background-color: <?php echo $f; ?>"><font face="OCRB" style="font-size: xx-large;" color="<?php echo $a; ?>">
<p id="secimage"><?php echo $a; ?></p></font><input type="text" id="check" value="<?php echo $a; ?>" style="display: none;"/></div>
<button id="refresh">↑↓</button>
<input id="verify" type="text" placeholder="Enter code" />
<button id="send">Check</button>
<div id="result"></div>
</body>
</html>
使用jQuery的驗證碼驗證
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.