本文实例为大家分享了微信小程序实现随机验证码的具体代码,供大家参考,具体内容如下
效果图:
小程序上经常会有一些注册申请页面需要用到随机验证码。具体实现方法不多说直接上代码
& lt;视图类=yanzhengma的祝辞
& lt;文本类='左'祝辞{(代码)}& lt;/text>
& lt;文本类='正确' bindtap=' huanyizhang祝辞换一张& lt;/text>
& lt;/view>
CSS: ,
.yanzhengma {
身高:100 rpx;
显示:flex;
对齐项目:中心;
justify-content:中心;
}
.yanzhengma .left {
字体类型:Arial;
字体样式:斜体;
粗细:大胆的;
边界:0;
字母间距:3 px;
字体大小:18 px;
background - color: # ccc;
填充:10 rpx;
margin-right: 20 rpx;
颜色:蓝色;
}
js:
页面({
数据:{
},/* *
*生命周期函数——监听页面加载
*/onLoad:功能(选项){//刚进入页面随机先获取一个
this.createCode ()
},
huanyizhang () {
this.createCode ()
},
createCode () {
var代码;//首先默认代码为空字符串
代码=";//设置长度,这里看需求,我这里设置了4
var codeLength=4;//设置随机字符
var随机=new Array (0, 1, 2, 3, 4, 5, 6, 7, 8, 9, ' ', ' B ', ' C ', ' D ',‘E’,‘F’,‘G’,‘H’,‘我’,‘J’,‘K’,‘L’,‘米’,‘N’,‘O’,‘P’,‘问’,‘R’,‘S’,‘T’,‘你’,‘V’,‘W’,‘X’, ' Y ', ' Z ');//循环codeLength我设置的4就是循环4次
(var=0;我& lt;codeLength;我+ +){//设置随机数范围,这设置为0 ~ 36
var指数=Math.floor (math . random () * 36);//字符串拼接将每次随机的字符进行拼接
代码+=随机(指数);
}//将拼接好的字符串赋值给展示的代码
this.setData ({
代码:代码
})
},
})
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
