<script language="javascript">
var code; //在全局 定义验证码
function createCode()
{ //创建验证码函数
code = "";
var codeLength =4;//验证码的长度
var selectChar = new Array(0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f','g','h','i','j','k',
'l','m','n','o','p','q','r','s','t','u','v','w','x','y','z');//所有候选组成验证码的字符,当然也可以用中文的 for(var i=0;i<codeLength;i++)
{
var charIndex =Math.floor(Math.random()*36);
code +=selectChar[charIndex];
}
// 设置验证码的显示样式,并显示
document.getElementById("discode").style.fontFamily="Fixedsys"; //设置字体
document.getElementById("discode").style.letterSpacing="5px"; //字体间距
document.getElementById("discode").style.color="#0ab000"; //字体颜色
document.getElementById("discode").innerHTML=code; // 显示
} function but()
{//验证验证码输入是否正确
var val1=document.getElementById("t1").value;
var val2=code;
if(val1!=val2){
alert("验证码错误!");
document.getElementById('t1').value="";
}
}
</script>

验证码框

                <div class="input">
<input id="t1" type="text" name="u" placeholder="验证码" onblur="but()" />
<span id="discode"></span>
<input type="button" value="换一换" class="c" style="height:20px;"onClick="createCode()">
</div>

效果

js验证码实现的更多相关文章

  1. js 验证码 倒计时60秒

    js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...

  2. js验证码有效时间倒计时

    js验证码有效时间倒计时 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type& ...

  3. 纯js验证码

    纯js验证码 <!DOCTYPE html> <html> <head> <title>纯js验证码</title> </head&g ...

  4. easyui page添加文本,js验证码

    onLoadSuccess: function (db) { //db是后台数据的返回结果集 $.ajax({ url: "AjaxSource/Buex.ashx", data: ...

  5. JS验证码邮件

    js var time = 30; var canSend = true; function f5() { if (canSend) {//判断是否要ajax发送刷新验证码 验证码在后台刷新 //al ...

  6. js 验证码倒计时

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

  7. angular.js 验证码注册登录

    css部分 header{ height: 50px; line-height: 50px; display: flex; } .callback{ text-align: left; display ...

  8. 一些网站后台模板源码分析 Particleground.js 验证码

    转: https://blog.csdn.net/bcbobo21cn/article/details/51271750 1 灰色简洁企业后台管理模板 效果: 看下项目结构: 它使用了moderniz ...

  9. JS 验证码的实现

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

  10. JS验证码

    1.引用jquery 2.Html页面 <div> <canvas id="canvas" style="cursor: pointer; height ...

随机推荐

  1. 聊聊JVM(二)说说GC的一些常见概念

    转自CSDN 上一篇总结GC的基础算法,各种GC收集器的基本原理,还是比较粗粒度的概念.这篇会整理一些GC的常见概念,理解了这些概念,相信对GC有更加深入的理解 1. 什么时候会触发Minor GC? ...

  2. Unity3D热更新之LuaFramework篇[01]--从零开始

    前言 因工作关系,需要对手头的项目进行热更新支持.了解后发现,Lua的几个变种:XLua.ToLua(原uLua)和Slua都可以做Unity热更,而ToLua更是提供了一个简易的热更框架--LuaF ...

  3. Go语言远程执行ssh命令简单封装(支持带交互命令)

    使用包:golang.org/x/crypto/ssh 以下封装一个发送命令的Cli结构体 type Cli struct { IP string //IP地址 Username string //用 ...

  4. Java网络编程的基本网络概念

    前言 自己网络这方面的知识很是薄弱,每次面试被问到这部分都会卡壳,所以很尴尬,然后最近也是有些时间了,就赶紧把自己的不足补充一下.虽然最近也在看设计模式,但是总看设计模式也容易烦,所以就并行学习,看看 ...

  5. 区块链--Ubuntu上搭建以太坊私有链

    1.搭建私链所需环境 操作系统:ubuntu16.04,开虚拟机的话要至少4G,否则会影响测试挖矿时的速度 软件: geth客户端 Mist和Ethereum Wallet:https://githu ...

  6. 第1章 ssh命令和SSH服务详解

    基础服务类系列文章:http://www.cnblogs.com/f-ck-need-u/p/7048359.html 本文对SSH连接验证机制进行了非常详细的分析,还详细介绍了ssh客户端工具的各种 ...

  7. 完美实现 Windows 下网络通信

    编译环境:DEV C++ 配置编译器 Windows 下 实现 Socket 编译需要 ws2_32.lib 这个库的支撑,所以我们编译前应该配置下编译器,具体配置步骤如下: Tools -> ...

  8. [转]Virtualbox主机和虚拟机之间文件夹共享及双向拷贝(Windows<->Windows, Windows<->Linux)

    本文转自:https://www.jb51.net/article/97271.htm 最近学习Virtualbox的一些知识,记录下,Virtualbox下如何实现主机和虚拟机之间文件夹共享及双向拷 ...

  9. [转]Database Transactions in Laravel

    本文转自:https://fideloper.com/laravel-database-transactions Laravel's documentation on Database Transac ...

  10. [转]WEB页获取串口数据

    本文转自:https://www.cnblogs.com/rockyhm/p/3434200.html 最近做一个B/S的项目,需要读取电子秤的值,之前一直没做过,也没有经验,于是在网上找到很多  大 ...