微信小程序实现点击生成随机验证码


Posted in Javascript onSeptember 09, 2020

本文实例为大家分享了微信小程序实现点击生成随机验证码的具体代码,供大家参考,具体内容如下

效果图

微信小程序实现点击生成随机验证码

wxml

<view bindtap="getCode">{{ code }}</view>

js

Page({
data: {
 code: ''
},
onLoad() {
 //进入页面就调用方法 创建一个随机验证码
 this.createCode()
},

getCode() {
 //点击调用创建验证码方法
 this.createCode()
},

//创建随机验证码方法
createCode() {
 let code = ''; //初始化验证码
 let codeLength = 6; //设置验证码长度
 //设置随机字符
 let txt = 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(let i = 0; i < codeLength; i++) {
 //设置随机数范围
 let index = Math.floor(Math.random() * 36);
 code += txt[index];
 }
 //动态设置数据
 this.setDate({
 code
 }) 
}
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
flash javascript之间的通讯方法小结
Dec 20 Javascript
Jquery 1.42 checkbox 全选和反选代码
Mar 27 Javascript
中文路径导致unitpngfix.js不正常的解决方法
Jun 26 Javascript
jQuery学习笔记之jQuery动画效果
Sep 09 Javascript
js实现模拟银行卡账号输入显示效果
Nov 18 Javascript
基于jquery实现日历签到功能
Sep 11 Javascript
在javaScript中检测数据类型的几种方式小结
Mar 04 Javascript
解决vue router使用 history 模式刷新后404问题
Jul 19 Javascript
微信小程序模拟cookie的实现
Jun 20 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
Sep 16 Javascript
vue 授权获取微信openId操作
Nov 13 Javascript
React + Threejs + Swiper 实现全景图效果的完整代码
Jun 28 Javascript
vue 获取元素额外生成的data-v-xxx操作
Sep 09 #Javascript
vue移动端写的拖拽功能示例代码
Sep 09 #Javascript
vue路由的配置和页面切换详解
Sep 09 #Javascript
JavaScript 实现下雪特效的示例代码
Sep 09 #Javascript
在Vue中获取自定义属性方法:data-id的实例
Sep 09 #Javascript
vue+高德地图实现地图搜索及点击定位操作
Sep 09 #Javascript
vue实现几秒后跳转新页面代码
Sep 09 #Javascript
You might like
用PHP制作静态网站的模板框架(三)
2006/10/09 PHP
PHP stristr() 函数(不区分大小写的字符串查找)
2010/06/03 PHP
php中选择什么接口(mysql、mysqli)访问mysql
2013/02/06 PHP
PHP中把stdClass Object转array的几个方法
2014/05/08 PHP
destoon安全设置中需要设置可写权限的目录及文件
2014/06/21 PHP
PHP JSON出错:Cannot use object of type stdClass as array解决方法
2014/08/16 PHP
Laravel框架路由配置总结、设置技巧大全
2014/09/03 PHP
php curl请求信息和返回信息设置代码实例
2015/04/27 PHP
PHP代码判断设备是手机还是平板电脑(两种方法)
2015/10/19 PHP
PHP下载大文件失败并限制下载速度的实例代码
2019/05/10 PHP
农历与西历对照
2006/09/06 Javascript
datePicker——日期选择控件(with jquery)
2007/02/20 Javascript
javascript中的取反再取反~~没有意义
2014/04/06 Javascript
使用AngularJS中的SCE来防止XSS攻击的方法
2015/06/18 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
Bootstrap被封装的弹层
2016/07/20 Javascript
在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法
2016/08/05 Javascript
jQuery使用eraser.js插件实现擦除、刮刮卡效果的方法【附eraser.js下载】
2017/04/28 jQuery
微信小程序页面滑动屏幕加载数据效果
2020/11/16 Javascript
AngularJs 终极购物车(实例讲解)
2017/11/08 Javascript
pm2发布node配置文件ecosystem.json详解
2019/05/15 Javascript
Node.js 实现抢票小工具 &amp; 短信通知提醒功能
2019/10/22 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
2020/11/04 Javascript
微信小程序实现modal弹出框遮罩层组件(可带文本框)
2020/12/20 Javascript
python按行读取文件,去掉每行的换行符\n的实例
2018/04/19 Python
解决DataFrame排序sort的问题
2018/06/07 Python
python try except 捕获所有异常的实例
2018/10/18 Python
Python依赖包整体迁移方法详解
2019/08/15 Python
pycharm运行scrapy过程图解
2019/11/22 Python
pytorch中的上采样以及各种反操作,求逆操作详解
2020/01/03 Python
python 利用matplotlib在3D空间中绘制平面的案例
2021/02/06 Python
部队万能检讨书
2014/02/20 职场文书
高二学生评语大全
2014/04/25 职场文书
会计出纳岗位职责
2015/03/31 职场文书
人事行政主管岗位职责
2015/04/09 职场文书
解决pycharm下载库时出现Failed to install package的问题
2021/09/04 Python