PHP如何添加滑动验证码教程

小渣渣

效果图如上：

QapTcha是一个jQuery的可拖动captcha系统与jQuery UI！


QapTcha是一个易于使用的，简单而直观的captcha系统。
它需要人的行为，而不是读硬盘的文字，这是一个非常轻量级的jQuery插件。


为了与iPhone和iPad的工作，文件jquery.ui.touch.js已添加在V2.5！


QapTcha作品PHP5.2以上原因给函数json_encode（）！


它是如何工作的？
在DOM建设，QapTcha创建一个隐藏输入一个随机的名字“attribut充满了随机密码。
通常情况下，一个机器人填补所有输入到一个表单发送表单之前。


下降的目的是为了清空该随机输入，并设置一个$_SESSION [qaptcha_key']变量与Ajax中此随机值。


用PHP，只检查是否随机输入存在并且是空的，如果$_SESSION['qaptcha_key']填充这个随机值。
在PHP文件，你就必须做一些事情，如：

1. // check if $_SESSION['qaptcha_key'] created with AJAX exists
   
2. if(isset($_SESSION['qaptcha_key']) && !empty($_SESSION['qaptcha_key']))
   
3. {
   
4.   $myVar = $_SESSION['qaptcha_key'];
   
5.   
   
6. // check if the random input created exists and is empty
   
7.   if(isset($_POST[''.$myVar.'']) && empty($_POST[''.$myVar.'']))
   
8.   {
   
9.     //mail can be sent
   
10.   }
    
11.   else
    
12.   {
    
13.     //mail can not be sent
    
14.   }
    
15. }
    
16. unset($_SESSION['qaptcha_key']);

复制代码

Implementation:
1. First, include the CSS & jQuery files

1. <!-- include CSS & JS files -->
   
2. <!-- CSS file -->
   
3. <link rel="stylesheet" type="text/css" href="QapTcha.jquery.css" media="screen" />
   
4. 
   
5. <!-- jQuery files -->
   
6. <scrip去掉t type="text/javascrip去掉t" src="jquery.js"></scrip去掉t>
   
7. <scrip去掉t type="text/javascrip去掉t" src="jquery-ui.js"></scrip去掉t>
   
8. <scrip去掉t type="text/javascrip去掉t" src="jquery.ui.touch.js"></scrip去掉t>
   
9. <scrip去掉t type="text/javascrip去掉t" src="QapTcha.jquery.js"></scrip去掉t>

复制代码

2. add a DIV with the class "qaptcha" into your form

1. <form method="post" action="">
   
2.   <fieldset>
   
3.     <label>First Name</label> <input type="text" name="firstname" />
   
4.     <label>Last Name</label> <input type="text" name="lastname" />
   
5.     <div class="clr"></div>
   
6. 
   
7.     <!-- Add this line in your form -->
   
8.     <div class="QapTcha"></div>
   
9. 
   
10.     <input type="submit" name="submit" value="Submit form" />
    
11.   </fieldset>
    
12. </form>

复制代码

3. PHP control before sending the form

1. // check if $_SESSION['qaptcha_key'] created with AJAX exists
   
2. if(isset($_SESSION['qaptcha_key']) && !empty($_SESSION['qaptcha_key']))
   
3. {
   
4.   $myVar = $_SESSION['qaptcha_key'];
   
5. 
   
6.   // check if the random input created exists and is empty
   
7.   if(isset($_POST[''.$myVar.'']) && empty($_POST[''.$myVar.'']))
   
8.   {
   
9.     //mail can be sent
   
10.   }
    
11.   else
    
12.   {
    
13.     //mail can not be sent
    
14.   }
    
15. }
    
16. unset($_SESSION['qaptcha_key']);

复制代码

4. Now, call Qaptcha plugin

1. <scrip去掉t type="text/javascrip去掉t">
   
2.   $(document).ready(function(){
   
3.     // Simple call
   
4.     $('.QapTcha').QapTcha();
   
5.    
   
6.     // More complex call
   
7.     $('.QapTcha').QapTcha({
   
8.       autoSubmit : true,
   
9.       autoRevert : true,
   
10.       PHPfile : 'path_to_my_php_file/Qaptcha.jquery.php'
    
11.     });
    
12.   });
    
13. </scrip去掉t>

复制代码

QapTcha-master.zip (53.93 KB, 下载次数: 13)

2015-5-12 17:27 上传

点击文件名下载附件

北城织温22度

在ASP.NET中使用Qaptcha做验证码成品附带源码
http://www.itsvse.com/forum.php?mod=viewthread&tid=1960
(出处: 武汉软件工程职业学院)