一个基于原生JavaScript开发的、轻量的验证码生成插件
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开发的、轻量的验证码生成插件的更多相关文章
- Cardinal:一个用于移动项目开发的轻量 CSS 框架
Cardinal 是一个适用于移动项目的 CSS 框架,包含很多有用的默认样式.矢量字体.可重用的模块以及一个简单的响应式模块系统.Cardinal 提供了一种在多种移动设备上实现可伸缩的字体和布局的 ...
- 基于Node和Electron开发了轻量版API接口请求调试工具——Post-Tool
Electron 是一个使用 JavaScript.HTML 和 CSS 构建桌面应用程序的框架. 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 Java ...
- vue-calendar 基于 vue 2.0 开发的轻量,高性能日历组件
vue-calendar-component 基于 vue 2.0 开发的轻量,高性能日历组件 占用内存小,性能好,样式好看,可扩展性强 原生 js 开发,没引入第三方库 Why Github 上很多 ...
- faked 一个用于 mock 后端 API 的轻量工具
一.简介 faked 是一个在前端开发中用于 mock 服务端接口的模块,轻量简单,无需要在本地启动 Server 也无需其它更多的资源,仅在浏览器中完成「请求拉截」,配合完整的「路由系统」轻而易举的 ...
- 原生javascript开发仿微信打飞机小游戏
今天闲来无事,于是就打算教一个初学javascript的女童鞋写点东西,因此为了兼顾趣味性与简易程度,果断想到了微信的打飞机小游戏.. 本来想用html5做的,但是毕竟人家才初学,连jquery都还不 ...
- 一个关于原生 js 开发一款插件的前端教程
教程链接: http://www.codeasily.net/course/plugin_course/ 写的不是很好,前面比较松后面比较急,请大家见谅,本人也没多少年前端经验,拿以前写过的教程网站, ...
- 原生javascript开发计算器实例
计算器的主要作用是进行数字运算,开发一个计算器功能的web实例,有助于更好的掌握js基础的数字运算能力. 本实例详细分析一个js计算器的开发步骤,学习本教程时最好先具备一些基础的js知识. 计算器包括 ...
- 基于.netcore 开发的轻量Rpc框架
Rpc原理详解 博客上已经有人解释的很详细了,我就不在解释了.传送门 项目简介 项目是依赖于.net core2.0版本,内部都是依靠IOC来实现的,方便做自定义扩展.底层的通信是采用socket,s ...
- 重构一段基于原生JavaScript的表格绘制代码
为了在CardSimulate项目中方便的显示技能和效果列表,决定重构以前编写的一段JavaScript代码——att表格绘制库,这段代码的作用是将特定的JavaScript数据对象转化为表格,支持精 ...
随机推荐
- Java进阶(五十一)必须记住的Myeclipse快捷键
Java进阶(五十一)必须记住的Myeclipse快捷键 在调试程序的时候,我们经常需要注释一些代码,在用Myeclipse编程时,就可以用 Ctrl+/ 为选中的一段代码加上以 // 打头的注释:当 ...
- R.java文件介绍
HelloWorld工程中的R.java文件 package com.android.hellworld; public final class R { public static final ...
- saiku中文维度,补充说明
saiku在筛选中文维度 会出现浏览器白屏 停止响应的现象,经过跟踪源代码,分析原来在linux 操作系统中 数据库读取的中文和界面选取的编码是不一致的 解决方法, classes\saiku-dat ...
- 【Android 应用开发】Android - 按钮组件详解
总结了Android中常用的按钮用法 示例源码下载地址 : -- CSDN : http://download.csdn.net/detail/han1202012/6852091 -- GitHu ...
- Cocos2d-swift V3.x 中的update方法
在cocos2d V3.x中update方法如果实现,则会被自动调用;不用向早期的版本那样要显式schedule. 但是你还是要显式schedule其他方法或blocks使用node的schedule ...
- iOS开发讲解SDWebImage,你真的会用吗?
SDWebImage作为目前最受欢迎的图片下载第三方框架,使用率很高.但是你真的会用吗?本文接下来将通过例子分析如何合理使用SDWebImage. 使用场景:自定义的UITableViewCell上有 ...
- web报表工具FineReport的SQL编辑框的语法简介
感谢大家捧场,这里继续分享关于SQL编辑框的一些语法心得总结,因为数据集定义的面板,也是FineReport报表中最常用的模块之一. 1.我理解的执行过程. 这里其实是生成一个字符串,FineRepo ...
- 个人Source Insight使用设置笔记
1.打开SourceInsight, 在菜单栏中点击Options-->Document Options 在显示的对话框中,点击Screen Fonts...., 可改变这个项目的字体,我选的是 ...
- OpenCV手写数字字符识别(基于k近邻算法)
摘要 本程序主要参照论文,<基于OpenCV的脱机手写字符识别技术>实现了,对于手写阿拉伯数字的识别工作.识别工作分为三大步骤:预处理,特征提取,分类识别.预处理过程主要找到图像的ROI部 ...
- 设计模式基础:类及类关系的UML表示
设计模式基础:类及类关系的UML表示 2009-10-26 17:00 by 宗哥, 1891 阅读, 1 评论, 收藏, 编辑 UML中,类关系分为这几种,泛化(generalization), 实 ...