1、引入js文件

2、实现

<%--
Created by IntelliJ IDEA.
User: a
Date: 2019/8/28
Time: 10:31
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>$Title$</title>
<script src="js/jquery-1.11.3.js"></script>
<script src="js/gVerify.js"></script>
</head>
<body>
<!--测试验证码的使用-->
<center>
<div id="v_container" style="width: 200px;height: 50px;"></div>
<input type="text" id="code_input" value="" placeholder="请输入验证码"/><button id="my_button">验证</button>
</center>
<!--导入js文件-->
<script>
//1创建验证码对象
var verifyCode = new GVerify("v_container");
//2为按钮绑定一个事件
document.getElementById("my_button").onclick = function(){
//3编写单击验证按钮后触发的行为
//3.1验证输入框中的值与验证码对象中的值是否一致
var res = verifyCode.validate(document.getElementById("code_input").value);
if(res){
alert("验证正确");
}else{
alert("验证码错误");
}
}
</script> </body>
</html>

gVerify验证码的更多相关文章

  1. 纯JS实现图片验证码功能并兼容IE6-8

    最近要搞一个图片验证码功能,但是又不想自己写后台代码.于是自己准备搞一个纯前端的验证码功能,于是网上搜索了一下,找到一个插件gVerify.js,简单好用,实现完美.不过后面接到说要兼容IE8,想想也 ...

  2. JS图片验证码

    !(function(window, document) { var size = 5;//设置验证码长度 function GVerify(options) { //创建一个图形验证码对象,接收op ...

  3. Jquery 插件 图片验证码

    摘自:https://www.cnblogs.com/lusufei/p/7746465.html !(function(window, document) { var size = 5;//设置验证 ...

  4. H5+JS生成验证码

    效果图如下: <canvas id="canvas1" style="margin-left: 200px;"></canvas>< ...

  5. js-验证码插件gVerify.js

    插件 gVerify.js 源码 !(function(window, document) { function GVerify(options) { //创建一个图形验证码对象,接收options对 ...

  6. 前端登录jq图形验证码

    <!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8" ...

  7. 利用canvas绘制带干扰线的验证码

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. JS 验证码的实现

    转自:https://github.com/ace0109/verifyCode 正要做一个验证码,网上找到这个还不错: gVerify.js: !(function(window, document ...

  9. .net点选验证码实现思路分享

    哈哈好久没冒泡了,最进看见点选验证码有点意思,所以想自己写一个. 先上效果图 如果你被这个效果吸引了就请继续看下去. 贴代码前先说点思路: 1.要有一个汉字库,并按字形分类.(我在数据库里是安部首分类 ...

随机推荐

  1. 【剑指 Offer】10-I.斐波那契数列

    题目描述 写一个函数,输入 n ,求斐波那契(Fibonacci)数列的第 n 项.斐波那契数列的定义如下: F(0) = 0,   F(1) = 1 F(N) = F(N - 1) + F(N - ...

  2. LeetCode109 将有序链表转为二叉搜索树

    给定一个单链表,其中的元素按升序排序,将其转换为高度平衡的二叉搜索树. 本题中,一个高度平衡二叉树是指一个二叉树每个节点 的左右两个子树的高度差的绝对值不超过 1. 示例: 给定的有序链表: [-10 ...

  3. 【Linux】kali 安装 python3 和 pip3(亲测有效)

    [Linux]kali 安装 python3 和 pip3 引言:   在使用kali的时候,经常会用到各种工具以及脚本,而大多数脚本都是以python编写的,但是烦就烦在python有2个版本,有些 ...

  4. IO软件层次结构与假脱机技术

    IO软件层次结构 用户层软件->设备独立性软件->设备驱动软件->中断处理程序->硬件 用户层软件实现与用户交互的接口,用户可直接使用该层提供的,与IO操作相关的库函数对设备进 ...

  5. 【Linux】CentOS4 系统最后的网络yum源

    ------------------------------------------------------------------------------------------------- | ...

  6. 【Oracle】查看表空间是否为自动扩展

    查看指定的表空间是否为自动扩展 SQL>   select file_name,autoextensible,increment_by from dba_data_files where tab ...

  7. 企业项目迁移go-zero全攻略(一)

    作者:Mikael 最近发现 golang 社区里出了一个新兴的微服务框架.看了一下官方提供的工具真的很好用,只需要定义好 .api 文件模版代码都可以一键生成,只需要关心业务:同时 core 中的工 ...

  8. mongodb简单运用

    mongodb NoSQL(Not Only SQL),意思是"不仅仅是 SQL",指的是非关系型数据库,是对不同于传统的关系型数据库的数据库管理系统的统称. NoSQL 用于超大 ...

  9. 命名秘籍周获近五千星——GitHub 热点速览 v.21.04

    作者:HelloGitHub-小鱼干 命名一直是编程界的难点,这次 naming-cheatsheet 就能帮上你的忙.按照它的 SID(Short..Intuitive.Descriptive)原则 ...

  10. 转 jmeter测试手机号码归属地

    jmeter测试手机号码归属地   jmeter测试手机号码归属地接口时,HTTP请求有以下两种书写方法: 1.请求和参数一同写在路径中 2.参数单独写在参数列表中 请求方法既可以使用GET方法又可以 ...