Ajax提交表单时验证码自动验证 php后端验证码检测


Posted in PHP onJuly 20, 2016

本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码。

1、前端代码 index.html

<!DOCTYPE html>
<html>
<head>
 <title>验证码提交自验证</title>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta http-equiv="Content-Language" content="zh-CN" />
</head>
<body>
 <form action="doPost.php" method="POST">
  
  <div class="row">
   <label for="username">用户名</label>
   <input type="text" name="username" id="username" />
  </div>
  <div class="row">
   <label for="mod-captcha-code">验证码</label>
   <input name="code" id="mod-captcha-code" size="6" class="zjcaptcha" style="width:80px" type="text"/>
   <img class="code-img" style="height:30px;width:80px;" src="createcode.php?t=0" onclick="this.src=this.src.substring(0,this.src.indexOf('?')+1)+Math.random();return false;" />
   <script type="text/javascript" src="http://www.zjmainstay.cn/jquery/jquery-1.8.2.min.js"></script>
   <div class="yzmtips" style="color:red"></div>
  </div>
  <div class="row">
   <input type="submit" value="提交" class="submitBtn"/>
  </div>
 </form>
<script>
(function($){
 $(document).ready(function(){
  $(".submitBtn").click(function() {
   var obj = $(this);
   $.ajax({
    url:'checkcode.php',
    type:'POST',
    data:{code:$.trim($("input[name=code]").val())},
    dataType:'json',
    async:false,
    success:function(result) {
     if(result.status == 1) {
      obj.parents('form').submit(); //验证码正确提交表单
     }else{
      $(".code-img").click();
      $(".yzmtips").html('验证码错误!');
      setTimeout(function(){
       $(".yzmtips").empty();
      },3000);
     }
    },
    error:function(msg){
     $(".yzmtips").html('Error:'+msg.toSource());
    }
   })
   return false;
  })
 });
})(jQuery);
</script>
</body>
</html>

 2、后端验证码检测 checkcode.php

<?php
/**
* 用户验证码验证文件
* @Author:Zjmainstay
* @version : 1.0
* @creatdate: 2013-10-4
*/
session_start();
echo json_encode(array('status'=>(int)($_SESSION["CHECKCODE"] == $_POST['code'])));
exit;

 源码下载地址:Ajax实现提交表单时验证码自动验证

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
php strstr查找字符串中是否包含某些字符的查找函数
Jun 03 PHP
PHP 设置MySQL连接字符集的方法
Jan 02 PHP
phpstrom使用xdebug配置方法
Dec 17 PHP
windows下配置apache+php+mysql时出现问题的处理方法
Jun 20 PHP
基于PHP实现商品成交时发送短信功能
May 11 PHP
php使用curl代理实现抓取数据的方法
Feb 03 PHP
Laravel 5使用Laravel Excel实现Excel/CSV文件导入导出的功能详解
Oct 11 PHP
yii2 url重写并隐藏index.php方法
Dec 10 PHP
laravel框架中间件 except 和 only 的用法示例
Jul 12 PHP
php实现 master-worker 守护多进程模式的实例代码
Jul 20 PHP
PHP的图像处理实例小结【文字水印、图片水印、压缩图像等】
Dec 20 PHP
php实现商城购物车的思路和源码分析
Jul 23 PHP
php使用get_class_methods()函数获取分类的方法
Jul 20 #PHP
PHP+Ajax验证码验证用户登录
Jul 20 #PHP
PHP+Ajax实现验证码的实时验证
Jul 20 #PHP
php+ajax注册实时验证功能
Jul 20 #PHP
PHP实现的随机IP函数【国内IP段】
Jul 20 #PHP
Zend Framework教程之Zend_Helpers动作助手ViewRenderer用法详解
Jul 20 #PHP
php+flash+jQuery多图片上传源码分享
Jul 27 #PHP
You might like
用PHP产生动态的影像图
2006/10/09 PHP
Smarty模板快速入门
2007/01/04 PHP
php csv操作类代码
2009/12/14 PHP
采用ThinkPHP中F方法实现快速缓存实例
2014/06/13 PHP
WordPress中限制非管理员用户在文章后只能评论一次
2015/12/31 PHP
php getcwd与dirname(__FILE__)区别详解
2016/09/24 PHP
php自定义截取中文字符串-utf8版
2017/02/27 PHP
PHP正则匹配操作简单示例【preg_match_all应用】
2017/07/10 PHP
php + WebUploader实现图片批量上传功能
2019/05/06 PHP
jQuery开发者都需要知道的5个小技巧
2010/01/08 Javascript
基于jQuery的固定表格头部的代码(IE6,7,8测试通过)
2010/05/18 Javascript
IE6 fixed的完美解决方案
2011/03/31 Javascript
JS中字符串trim()使用示例
2015/05/26 Javascript
常用javascript表单验证汇总
2020/07/20 Javascript
详解Document.Cookie
2015/12/25 Javascript
纯原生js实现table表格的增删
2017/01/05 Javascript
深入理解 JavaScript 中的 JSON
2017/04/06 Javascript
vue bootstrap小例子一枚
2017/06/09 Javascript
最全正则表达式总结:验证QQ号、手机号、Email、中文、邮编、身份证、IP地址等
2017/08/16 Javascript
基于vue-cli vue-router搭建底部导航栏移动前端项目
2018/02/28 Javascript
使用Vue.js开发微信小程序开源框架mpvue解析
2018/03/20 Javascript
vue操作下拉选择器获取选择的数据的id方法
2018/08/24 Javascript
详解微信小程序之scroll-view的flex布局问题
2019/01/16 Javascript
jquery实现上传文件进度条
2020/03/26 jQuery
Vue实现浏览器打印功能的代码
2020/04/17 Javascript
使用Python的Flask框架实现视频的流媒体传输
2015/03/31 Python
用Python实现斐波那契(Fibonacci)函数
2016/03/25 Python
python中 logging的使用详解
2017/10/25 Python
python简易远程控制单线程版
2018/06/20 Python
python随机数分布random测试
2018/08/27 Python
Python中使用双下划线防止类属性被覆盖问题
2019/06/27 Python
python利用JMeter测试Tornado的多线程
2020/01/12 Python
工程部经理岗位职责
2015/02/02 职场文书
升级 Win11 还是坚守 Win10?微软 Win11 新系统缺失功能大盘点
2022/04/05 数码科技
Mybatis-Plus 使用 @TableField 自动填充日期
2022/04/26 Java/Android
redis protocol通信协议及使用详解
2022/07/15 Redis