verify.js纯前端验证码插件

这是一款极简洁的表单校验插件，属于半封装模式，只需引入插件，即可任意编写业务逻辑代码，简单方便易修改。

首先引入js，需提前引入jquery，然后引入verift即可使用

<script src="js/verify.js"></script>

普通验证码

<h3>普通验证码</h3>
<div id="demo1"></div>
<div id="demo2"></div>
//js
$('#demo1').codeVerify({
   type : 1,
   width : '400px',
   height : '50px',
   fontSize : '30px',
   codeLength : 6,
   btnId : 'check-btn',
   ready : function() {
   },
   success : function() {
      alert('验证匹配！');
   },
   error : function() {
      alert('验证码不匹配！');
   }
});
$('#demo2').codeVerify({
   type : 2,
   figure : 100,  //位数，仅在type=2时生效
   arith : 0, //算法，支持加减乘，不填为随机，仅在type=2时生效
   width : '200px',
   height : '50px',
   fontSize : '30px',
   btnId : 'check-btn2',
   ready : function() {
   },
   success : function() {
      alert('验证匹配！');
   },
   error : function() {
      alert('验证码不匹配！');
   }
});

滑块验证码

<h3>滑动验证码</h3>

<div id="demo1"></div>
<div id="demo2"></div>

    $('#demo1').slideVerify({
      type : 1,     //类型
      vOffset : 5,   //误差量，根据需求自行调整
      barSize : {
         width : '80%',
         height : '40px',
      },
      ready : function() {
      },
      success : function() {
         alert('验证成功，添加你自己的代码！');
         //......后续操作
      },
      error : function() {
//               alert('验证失败！');
      }
      
   });

    $('#demo2').slideVerify({
      type : 2,     //类型
      vOffset : 5,   //误差量，根据需求自行调整
      vSpace : 5,    //间隔
      imgName : ['1.jpg', '2.jpg'],
      imgSize : {
         width: '400px',
         height: '200px',
      },
      blockSize : {
         width: '40px',
         height: '40px',
      },
      barSize : {
         width : '400px',
         height : '40px',
      },
      ready : function() {
      },
      success : function() {
         alert('验证成功，添加你自己的代码！');
         //......后续操作
      },
      error : function() {
//               alert('验证失败！');
      }

   });

点击数字验证

<h3>点选验证码</h3>

<div id="demo"></div>

    $('#demo').pointsVerify({
      defaultNum : 4,    //默认的文字数量
      checkNum : 2,  //校对的文字数量
      vSpace : 5,    //间隔
      imgName : ['1.jpg', '2.jpg'],
      imgSize : {
         width: '600px',
         height: '200px',
      },
      barSize : {
         width : '600px',
         height : '40px',
      },
      ready : function() {
      },
      success : function() {
         alert('验证成功，添加你自己的代码！');
         //......后续操作
      },
      error : function() {
//               alert('验证失败！');
      }
      
   });

想下载verify.js 可以移步 https://download.csdn.net/download/qq_28073073/10884596