Vcode.js

一个基于原生JavaScript开发的、轻量的验证码生成插件

V: 1.0.0

DEMO:https://jofunliang.github.io/Vcode.js/example.html

安装

<script src="Vcode.min.js"></script>

OR

// ES6 Modules or TypeScript
import vcode from 'Vcode' // CommonJS
const vcode = require('Vcode')

Support AMD/CMD/ES6 module standard.

使用示例

var vcode1 = new Vcode({
el:"#demo1 .code",
count:4,
fontSize:"60px",
type:"number",
spacing:0
});

参数

attribute typeof description
el string 必需,接受一个包含CSS选择符的字符串,然后用它来匹配一个元素。
data string 可选,您可以自定义验证码的数据源。
count number 可选,验证码的长度,默认为4
type string 可选,验证码的类型,有三种模式,分别是数字模式、字母模式、数字字母随机混合模式。默认是数字字母随机混合模式
fontSize string 可选,验证码的字体大小。
spacing string 可选,验证码的字母间距。默认值为0

new Vcode对象的属性和方法

property typeof description
el object 挂载元素。
code string 验证码。
data string 验证码的数据源。
count number 验证码的长度。
onReset function 重新生成新的验证码。

注:此插件在ie8和ie9浏览器上会降级显示。

一个基于原生JavaScript开发的、轻量的验证码生成插件的更多相关文章

  1. Cardinal:一个用于移动项目开发的轻量 CSS 框架

    Cardinal 是一个适用于移动项目的 CSS 框架,包含很多有用的默认样式.矢量字体.可重用的模块以及一个简单的响应式模块系统.Cardinal 提供了一种在多种移动设备上实现可伸缩的字体和布局的 ...

  2. 基于Node和Electron开发了轻量版API接口请求调试工具——Post-Tool

    Electron 是一个使用 JavaScript.HTML 和 CSS 构建桌面应用程序的框架. 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 Java ...

  3. vue-calendar 基于 vue 2.0 开发的轻量,高性能日历组件

    vue-calendar-component 基于 vue 2.0 开发的轻量,高性能日历组件 占用内存小,性能好,样式好看,可扩展性强 原生 js 开发,没引入第三方库 Why Github 上很多 ...

  4. faked 一个用于 mock 后端 API 的轻量工具

    一.简介 faked 是一个在前端开发中用于 mock 服务端接口的模块,轻量简单,无需要在本地启动 Server 也无需其它更多的资源,仅在浏览器中完成「请求拉截」,配合完整的「路由系统」轻而易举的 ...

  5. 原生javascript开发仿微信打飞机小游戏

    今天闲来无事,于是就打算教一个初学javascript的女童鞋写点东西,因此为了兼顾趣味性与简易程度,果断想到了微信的打飞机小游戏.. 本来想用html5做的,但是毕竟人家才初学,连jquery都还不 ...

  6. 一个关于原生 js 开发一款插件的前端教程

    教程链接: http://www.codeasily.net/course/plugin_course/ 写的不是很好,前面比较松后面比较急,请大家见谅,本人也没多少年前端经验,拿以前写过的教程网站, ...

  7. 原生javascript开发计算器实例

    计算器的主要作用是进行数字运算,开发一个计算器功能的web实例,有助于更好的掌握js基础的数字运算能力. 本实例详细分析一个js计算器的开发步骤,学习本教程时最好先具备一些基础的js知识. 计算器包括 ...

  8. 基于.netcore 开发的轻量Rpc框架

    Rpc原理详解 博客上已经有人解释的很详细了,我就不在解释了.传送门 项目简介 项目是依赖于.net core2.0版本,内部都是依靠IOC来实现的,方便做自定义扩展.底层的通信是采用socket,s ...

  9. 重构一段基于原生JavaScript的表格绘制代码

    为了在CardSimulate项目中方便的显示技能和效果列表,决定重构以前编写的一段JavaScript代码——att表格绘制库,这段代码的作用是将特定的JavaScript数据对象转化为表格,支持精 ...

随机推荐

  1. OpenCV特征点检测算法对比

    识别算法概述: SIFT/SURF基于灰度图, 一.首先建立图像金字塔,形成三维的图像空间,通过Hessian矩阵获取每一层的局部极大值,然后进行在极值点周围26个点进行NMS,从而得到粗略的特征点, ...

  2. android ndk编译项目(android-ndk-16r1)

    由于采用android-ndk-16r1版本的ndk来编译 编译的环境之类在这里省略,注意是最后编译的命令如下 Administrator@WIN-AF6P80LVIJ0 ~ $ cd $ANDROI ...

  3. Linux进程状态解析之R、S、D、T、Z、X

    文章转载自:http://hi.baidu.com/shining_pc/item/21abcb32a4d2d484c3cf2950 Linux是一个多用户,多任务的系统,可以同时运行多个用户的多个程 ...

  4. UE4 创建自己的角色

    首先,需要在UE4中设置自己需要输入的按键,点击工具栏的Settings/ProjectSettings,找到input,在Bindings下添加自己需要的输入按键,我这里绑定了JumpBtn.Mov ...

  5. 【Qt编程】基于QWT的曲线绘制及图例显示操作

    在<QWT在QtCreator中的安装与使用>一文中,我们完成了QWT的安装,这篇文章我们讲讲基础曲线的绘制功能. 首先,我们新建一个Qt应用程序,然后一路默认即可.这时,你会发现总共有: ...

  6. "《算法导论》之‘线性表’":基于指针实现的单链表

    对于单链表的介绍部分参考自博文数组.单链表和双链表介绍 以及 双向链表的C/C++/Java实现. 1. 单链表介绍 单向链表(单链表)是链表的一种,它由节点组成,每个节点都包含下一个节点的指针.   ...

  7. iOS监听模式系列之对APNs的认知与理解

    前言: APNs 协议在近两年的 WWDC 上改过两次, 15 年 12 月 17 日更是推出了革命性的新特性.但在国内传播的博客.面试题里关于 APNs 的答案全都是旧的.错的. 导航: 对 APN ...

  8. linux下将eclipse项目转换为gradle项目

    本文针对于在linux环境下,不使用eclipse而把一个eclipse项目转换为gradle默认结构的项目的情况,脚本可能在mac下也适用,未验证. windows中的转换问题,以及使用eclips ...

  9. PHP开发环境apache搭建

    首先我们先来了解一下PHP的一些相关的基础知识: PHP是啥? php其实就是超文本预处理程序,一种制作网站的脚本程序. 通常PHP的运行环境有以下两种: wamp  windows+apache+m ...

  10. Mina源码阅读笔记(七)—Mina的拦截器FilterChain

    Filter我们很熟悉,在Mina中,filter chain的用法也类似于Servlet的filters,这种拦截器的设计思想能够狠轻松的帮助我们实现对资源的统一处理.我们先大致连接下mina中的f ...