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

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后端验证码检测的更多相关文章

  1. KindEditor：Ajax提交表单时获取不到HTML内容

    当用Ajax提交表单时,KindEditor的内容获取不到,HTML数据获取不了 原因:当ajax提交时,KindEdito的HTML数据还没有同步到表单中来,那怎么去获取HTML数据呢? ----- ...

  2. Dwz/Jquery--使用Ajax提交表单时调用表单设置的校验

    案例 今天有一个需求就是点击按钮时,使用ajax方式提交表单,而且不是直接用form表单下的submit按钮提交,表单中用的校验是dwz 自带的校验方式,表单模板如下: <li><d ...

  3. Ajax实现提交表单时验证码自动验证（原创自Zjmainstay）

    本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...

  4. Validator验证Ajax提交表单的方法

    Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...

  5. JQuery ajax提交表单及表单验证

    JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目   注:经过验证,formValidator只适合一个 ...

  6. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  7. JavaWeb网上图书商城完整项目--day02-4.regist页面提交表单时对所有输入框进行校验

    1.现在我们要将table表中的输入的参数全部提交到后台进行校验,我们提交我们是按照表单的形式提交,所以我们首先需要在table表外面添加一个表单 <%@ page language=" ...

  8. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  9. Jquery ajax提交表单几种方法详解

    [导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...

随机推荐

  1. 管道符和作业控制 shell变量 环境变量配置文件

    8.6 管道符和作业控制 8.7/8.8 shell变量 8.9 环境变量配置文件 管道符和作业控制 管道符:表示把一个文件的输出内容传送到后面的命令 grep  用来过滤指定关键词的命令 “|” 为 ...

  2. 【WP8】ResourceDictionary

    WP8中引用资源字典 当我们定义的样式太多的时候,我们可以把样式分别定义在不同的文件中,然后通过 MergedDictionaries 应用到其他资源字典中,看下面Demo 我们可以把样式定义在多个文 ...

  3. 解决sourcesafe admin用户自动登录并且不用密码的问题

    用管理员(admin)登录Microsoft   Visual   SourceSafe   Administration tools-> "SourceSafe   Options界 ...

  4. Android ROM 打包记录

    android5.1平板或手机应用层一些常用的修改项及目录所在: 1.所以系统应用所在的目录: \alps\packages\apps 2.一些系统属性的定义:并且可以仿写自行定义变量 \alps\b ...

  5. 基于NDK的Android防破解& Android防破解 【转载】

    两篇防破解文章转载 基于NDK的Android防破解:http://blog.csdn.net/bugrunner/article/details/8634585 Android防破解:http:// ...

  6. 搭建项目Maven+springMVC+hibernate时，JUnit測试出现报ClassNotFoundException错误的解决

    近期在搭建Maven+springMVC+hibernate项目,正常启动项目时一切正常.但JUNIT測试时出现报ClassNotFoundException错误,经过细致排查发现没有生成class文 ...

  7. __stdcall __cdecl 引起的程序崩溃

    崩溃弹出的截图如下 看到0xC0000005, 访问冲突的问题, 九成九是内存访问违规, 比如访问了已经释放的指针, 又或者是离开函数时栈被破坏之类. 找了一下午一直没有头绪, 好在有一份可以执行的源 ...

  8. PHPMailer命令执行及任意文件读取漏洞

    今天在thinkphp官网闲逛,无意下载了一套eduaskcms,查看了一下libs目录中居然存在PHPMailer-5.2.13,想起了之前看到的PHPMailer的漏洞,可惜这套CMS只提供了一个 ...

  9. metasploit 中的DB

    渗透测试任务中,主机/服务/漏洞等信息如果手动维护,会带来巨大的工作量. 在metasploit中,这部分工作已经被封装的非常好,每次调用内部模块执行的任务结果都会自动存入DB.通过简单的指令即可以方 ...

  10. SaltStack salt-run 命令

    salt-run 常见用法如下: salt-run manage.up # 查看在线的minion salt-run manage.down # 查看不在线的minion salt-run manag ...