在JS中怎样实现点击后生成随机4位验证码的功能
Admin 2022-05-30 群英技术资讯 1206 次浏览
这篇文章主要介绍“在JS中怎样实现点击后生成随机4位验证码的功能”,有一些人在在JS中怎样实现点击后生成随机4位验证码的功能的问题上存在疑惑,接下来小编就给大家来介绍一下相关的内容,希望对大家解答有帮助,有这个方面学习需要的朋友就继续往下看吧。本文实例为大家分享了js实现点击按钮生成4位随机验证码的具体代码,供大家参考,具体内容如下
效果图:

代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
width: 100px;
height: 50px;
background: red;
text-align: center;
line-height: 50px;
}
</style>
</head>
<body>
<div id="yzm"></div>
<button id="btn">点击生成验证码</button>
<script>
// var str = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
//数组转换为字符串
// var arr = str.split("");
var arr = ["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", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
// console.log(arr);
//页面刚加载时候调用它
sjs(arr);
btn.onclick = function() {
sjs(arr);
}
function sjs(arr) {
var code = Math.floor(Math.random() * arr.length);
var code1 = Math.floor(Math.random() * arr.length);
var code2 = Math.floor(Math.random() * arr.length);
var code3 = Math.floor(Math.random() * arr.length);
var n = arr[code] + arr[code1] + arr[code2] + arr[code3];
yzm.innerHTML = n
}
</script>
</body>
</html>
小编再为大家分享一段代码:点击产生四位随机数字母与数字
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>点击产生随机数</title>
<style>
span{
display: block;
width: 110px;
height: 50px;
border: 1px solid red;
text-align: center;
line-height: 50px;
}
</style>
</head>
<body>
<span id="demo" onclick="init();"></span>
<script>
init();
function init(){
var arr=[];
for(var i=48;i<123;i++){
if(i>57 && i<65) continue;
if(i>90 && i<97) continue;
arr.push(String.fromCharCode(i));
}
arr.sort(function () {
return Math.random()-0.5;
});
arr.length=4;
var span= document.getElementById('demo');
span.textContent=(arr.join(""));
}
</script>
</body>
</html>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
TypeScript中命名空间与模块化详情 目录 一.模块 二.命名空间 三.区别 一.模块 TypeScript 与ECMAScript 2015 一样,任何包含顶级 import 或者 export 的文件都被当成一个模块 相反地,如果一个文件不带有顶级的import或者export声明,那么它的内容被视为全局可见的 例如我们在在一个 TypeScript 工程下建立一个文件 1.ts,声明一个变量a,如下: const a = 1 然后在另一个文件同样声明一个变量a,这时候会出现错误信息 提示重复声明a变量,但是所处的空间是全局的
这篇文章主要介绍了Vue实现圆环进度条的示例,帮助大家更好的理解和使用前端框架进行开发,感兴趣的朋友可以了解下
vue项目或网页上实现文字转换成语音播放功能,一些朋友可能会遇到这方面的问题,对此在下文小编向大家来讲解一下,内容详细,易于理解,希望大家阅读完这篇能有收获哦,有需要的朋友就往下看吧!
本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于数组去重的相关问题,包括了es6的set去重、双重for循环去重、indexof去重等等内容,下面一起来看一下,希望对大家有帮助。
目录前言一、forEach(),用于遍历数组,无返回值二、map(),用于遍历数组,返回处理之后的新数组三、every(),用于判断数组中的每一项元素是否都满足条件,返回一个布尔值四、some(),用于判断数组中的是否存在满足条件的元素,返回一个布尔值五、filter(),用于筛选数组中满足条件的元素,返回一个筛选后的
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 ICP核准(ICP备案)粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008