原生JS实现随机生成指定位数的验证码并校验

最新推荐文章于 2022-09-19 10:56:43 发布

文盗任情

最新推荐文章于 2022-09-19 10:56:43 发布

阅读量2.2k

点赞数 1

分类专栏： JavaScript 文章标签：验证码 javascript HTML CSS

本文链接：https://blog.csdn.net/Qianqianliuliu/article/details/78376674

版权

这篇博客介绍了如何使用原生JavaScript生成指定长度的验证码，并实现大小写不敏感的验证码校验。通过生成随机Unicode编码对应字母或数字，再进行校验，实现了功能完备的验证码系统。

摘要由CSDN通过智能技术生成

功能：1.生成随机指定位数的验证码，生成的验证码字符可以是字母或数字
2. 忽略字母大小写比较验证码是否输入正确

一、求字母和数字的Unicode 编码

用str.charCodeAt()；来求解：

0~9: 48-57
A-Z: 65-90
a-z: 97-122

二、利用Math.random（）求随机数

str.formCharCode()从字符编码创建一个字符串

校验时统一转化为大写或者小写，这样子验证时可以忽略验证码的大小写

三、效果图

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

文盗任情

关注关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

图片验证码

余生一个帆的博客

04-03

1441

前言什么是图片验证码？先参考一个某宝注册时的form表单（我们在一些网站注册的时候，经常需要填写以下图片的信息）为什么要写图片验证码？这种图片验证方式是我们最常见的形式，它可以有效的防范恶意攻击者采用恶意工具，调用“动态验证码短信获取”接口进行动态短信发送, 导致接入用户短信被刷，造成账号余额损失。同时这种动态发送方式会朝许多无关的手机用户，发送很多验证码短信，导致手机用户被骚扰，甚至引...

django-实现登录短信验证

e5354966xieo1的博客

12-29

948

功能演示核心任务前端功能: 点击按钮Ajax调用发送验证码功能输完验证码后Ajax调用验证功能后端功能: 功能1:发送验证码功能功能2:验证码检查后台核心逻辑(不需要手写) 功能3:发短信功能4:生成短信验证码(随机生成6位数字) 集成Redis 使用Redis代替session缓存, 存储数据! Redis集成到Django中! 扩展功能: 统一接...

参与评论您还未登录，请先登录后发表或查看评论

js生成四位验证码并验证

08-31

js生成四位验证码并验证，一个可行的demo，记得给好评哦。

原生js生成随机验证码

qq_43188340的博客

09-20

437

原生js生成随机验证验证码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...

用JavaScript生成随机验证码

苏某人的传奇世界

10-22

4145

说明:复制以下代码,即可生成效果.http://www.w3.org/1999/xhtml" > 无标题页 function validteCode(){ var codes = new Array(4); //用于存储随机验证码 var colors = new Array("Red","Green",

用JS,编写一个函数，生成4位数字的验证码 利用随机数

yewengao的博客

07-31

3961

// 第一种方法 function yanzhengma() { // Math.round()函数，表示四舍五入 Math.random()函数，表示随机数生成 // var num1 = Math.round(Math.random() * 10); // var num2 = Math.round(Math.random() * 10); // var num3 = Math.round(Math.

JavaScript 随机生成指定位数的验证码

ByRisonBoy

10-07

1224

代码片段： <html> <title>随机验证码</title> <body> <form name="form1"> 输入验证码的位数：<input name="num" type="text"/>

JavaScript基础 - 经典案例2 - 生成校验验证码

never_stop_study的博客

09-19

652

JavaScript基础案例

前端2020面试题195道

热门推荐

weijieyuhyt的博客

01-13

1万+

HTML5面试题一、 Doctype的作用? 严格模式和混杂模式的区分，以及如何触发这2种模式? <!DOCTYPE> 声明位于文档中的最前面，处于标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。 DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。严格模式就是浏览器根据web标准去解析页面，是一种要求严格的DTD，不允许使用任何表现层的语法，混杂模式...

工具类-随机产生指定位数的验证码

Chyson

04-23

356

public class ImageUtil { private static String[] strs = { "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "m", "n", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z", "2", "

原生JS生成指定位数的验证码

01-22

使用原生JS生成指定位数的验证码，验证码包括字母和数字 ##思路：使用String的fromCharCode方法将给定范围的随机数转为大小写字母，再通过随机数决定数组当前位置为大写字母，小写字母或者是数字，函数传入的参数当做该数组的长度，随机填好数组后，对数组内的元素做分情况处理：当该数组内没有数字时，需要随机修改一个字母为一个随机的数字；当该数组没有字母时，需随机修改一个数字为大写或者小写字母；正常情况下的有字母也有数字不做处理，每个判断语句的最后使用数组的join方法将该数组转换为字符串并return。 function verificationCode(num) { var arr

JS 最少代码实现随机十位字符串

04-26

NULL 博文链接：https://onestopweb.iteye.com/blog/2356166

JavaScript：随机生成一个指定长度的验证码

Bule_daze的博客

09-17

307

function randomCode(len) { const allStr = 'azxcvbnmsdfghjklqwertyuiopZXCVBNMASDFGHJKLQWERTYUIOP0123456789.*&^%$#@!~'; let code = ''; for (let index = 0; index < len; index++) { code += allStr.charAt(Math.floor(Math.random() * 72)); } c

利用javascript生成数字加字母的随机验证码

qq_39485970的博客

09-23

476

<!DOCTYPE html> <html> <head> <title>验证码</title> <meta charset="utf-8"> <script type="text/javascript"> window.onload=

随机生成验证码（JS）

weixin_44970764的博客

05-29

592

效果展示实现原理　　1. html：一般就是一个div：<divid="code"></div>，样式根据需求设计。　　2.JS：1）将所有的验证码所用的字符放在一个字符串中　　　　　 2）在这个字符串的字符个数以内，随机生成索引号　　　　　3）根据索引号查找对应字符，拼接成验证码的字符串代码实现 HTML： &...

JS实现随机验证码功能

guduershi的博客

03-21

412

1、验证码 验证是网页常出现的一个验证点，所谓验证码类型有很多，下面代码只是实现一个简单的验证功能。 2、随便加点样式 #code{ font-family:Arial; font-style:italic;

js 生成任意长度的随机数

weixin_39150852的博客

09-29

1721

function randomWord(length=32){//默认32位 //由以下元素组成 let arr=['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'...

pyton3 随机生成 数字和字母的验证码

Color的博客

07-24

1240

def create_code(): while True: code = random.randint(0x30, 0x5A) if code >= 0x30 and code = 0x41 and code <=0x5A:#数字字母的区段 return chr(code) def security_code():#验证码

js随机生成随机数（验证码）

AnniceCui的博客

09-24

3317

1.我们要先创建一个数组里面包含写大小写字母还有数字 let codeArr = [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', ...