js随机验证码
随机验证码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{margin:0;padding:0;}
#auth_code{width:200px;
height:100px;
border:1px solid #ccc;
margin:200px auto 0;
text-align:center;
line-height:100px;
font-size:50px;
letter-spacing:5px;
cursor:pointer;}
</style>
</head>
<body>
<div id="auth_code" onclick="auth_code()"></div>
<script>
//验证码内需要字符个数
var num=4;
//点击更换验证码
function auth_code(){
//获取id为box元素
var box=$("auth_code");
//随机改变字符
box.innerHTML=randstr();
//获取box里span元素,并换颜色
for(var i=0;i<num;i++){
var span=box.getElementsByTagName("span")[i];
span.style.color=randcolor16();
}
}
//获取元素通过ID-----------函数-----------
function $(IdName){
return document.getElementById(IdName);
}
//字符随机选取---------------函数------------
function randstr(){
var all = ['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', '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'];
var words="";
for(var i=0;i<num;i++){
var word=all[parseInt(Math.random()*all.length)];
words+="<span>"+word+"</span>";
}
return words;
}
//随机颜色rgb------------函数----------------
function randcolor(){
var color= parseInt(Math.random()*255);
var color1= parseInt(Math.random()*255);
var color2= parseInt(Math.random()*255);
return "rgb("+color+","+color1+","+color2+")"
}
//随机颜色十六进制-----------函数------------------
function randcolor16(){
var color="#";
var color16num = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f']
for(var i=1; i<=6;i++){
color+=color16num[parseInt(Math.random()*color16num.length)]
}
return color;
}
window.onload = auth_code();
</script>
</body>
</html>
js随机验证码的更多相关文章
- js随机生成验证码以及随机颜色
Javascript通过Math.random()随机生成验证码. 代码如下: <!DOCTYPE html><html> <head> <meta char ...
- js用正则表达式验证用户和密码的安全性,生成随机验证码
制作了一个表单,表单验证用户.密码.随机验证码 html页面
- js编写验证码
这是一个简单的js编写的验证码,自己已经亲自验证,没有问题了 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...
- canvas实现随机验证码
canvas实现随机验证码 知识点 canvas生成背景图和文字 设置字体样式和大小 String的fromCharCode(code码)生成大小写字母和数字 str.toLowerCase()转小写 ...
- js简单验证码的生成和验证
如何用js生成简单验证码,并验证是否正确的方法 1.html页面如下 <div> <table border="0" cellspacing="5&qu ...
- php实现动态随机验证码机制(CAPTCHA)
php实现动态随机验证码机制 验证码(CAPTCHA)是“Completely Automated Public Turing test to tell Computers and Humans Ap ...
- django-生成随机验证码
Python生成随机验证码,需要使用PIL模块. 安装: pip3 install pillow 1 1 pip3 install pillow 基本使用 1.创建图片 from PIL impo ...
- vue实现随机验证码功能
效果图: 1.html代码 <div class="form-group" style="display: flex;"> <div> ...
- python笔记-20 django进阶 (model与form、modelform对比,三种ajax方式的对比,随机验证码,kindeditor)
一.model深入 1.model的功能 1.1 创建数据库表 1.2 操作数据库表 1.3 数据库的增删改查操作 2.创建数据库表的单表操作 2.1 定义表对象 class xxx(models.M ...
随机推荐
- [design pattern](3) Dectorator
前言 很久没有写关于设计模式的博客了,实在是没有太多的精力去写.但个人觉得设计模式在我们的日常开发中还是挺重要的,它提高了软件的可维护性.因此还是有必要坚持学习设计模式,写博客主要是为了加深我对设计模 ...
- eclipse设置酷炫的代码颜色风格
eclipse安装默认的代码颜色风格是“白色背景”,颜色有些刺眼,于是想到手动去改eclipse的代码颜色,但改来改去还是很难达到我们的要求,甚至有时候将背景和某些代码的颜色改成相同,导致代码看不见. ...
- sqli-labs(17)
0x01简介 百度翻译了一下 基于错误的更新查询 字符型 第一次遇到这种情况 那我们先看看源代码行吧 不懂函数的百度 $result = mysql_query($sql);//返回查询的数据的一个结 ...
- PTA编程总结三
7-1 抓老鼠啊~亏了还是赚了? (20 分) 某地老鼠成灾,现悬赏抓老鼠,每抓到一只奖励10元,于是开始跟老鼠斗智斗勇:每天在墙角可选择以下三个操作:放置一个带有一块奶酪的捕鼠夹(T),或者放置一块 ...
- How jQuery UI Works
https://learn.jquery.com/jquery-ui/how-jquery-ui-works/ jQuery UI contains many widgets that maintai ...
- 【Win32 API】远程工具调用
前言 有时候,影城报障需要远程过去重现和处理,如果电脑没有安装远程工具的话,还需要营业员下载和安装,然后将账号密码发送过来,这样一来一回操作繁琐也浪费时间,所以我们可以设想一下这种场景,售票员点击在p ...
- QBXT Day 5图论相关
图论是NOIP的一个非常重要的考点,换句话说,没有图论,NOIP的考纲就得少一大半(虽然很NOIP没有考纲) 图论这玩意吧,和数论一样是非常变态的东西,知识点又多又杂,但是好在一个事,他比较直观比较好 ...
- 目标双站定位仿真C++代码
point-position2 初步完善版. 不再使用eigen库,行列式直接计算得出结果.判断共面异面分别处理. 先提取双站获得图像的匹配特征点,由双站位置信息解析目标位置. // point-po ...
- iOS证书详解
一.成员介绍1. Certification(证书)证书是对电脑开发资格的认证,每个开发者帐号有一套,分为两种:1) Developer Certification(开发证书)安装在电脑上 ...
- jpa多表leftjoin 查询,自定义返回结果
sql代码 自定义返回结果 package com.cdp.ecosaas.coredb.uua.sync.vo; import java.io.Serializable; public class ...