连续点击不影响
wxml
<view class="lia sa"> <view class="name">验证码</view> <input class="inp"></input> <view class="huoqu" bindtap="{{flag}}" style="background:{{bg}}">{{yzm}}</view> </view>
wxss
.lia{
height:82rpx;
width:80%;
margin-left:10%;
}
.lia .name{
height:82rpx;
line-height:82rpx;
font-size:28rpx;
color:#000000;
width:25%;
text-align: center;
float: left;
}
.lia .phone{
height:82rpx;
width:74%;
text-align: center;
border:3rpx solid #CCCCCC;
float: left;
}
.lia .inp{
height:78rpx;
width:45%;
float: left;
border:3rpx solid #CCCCCC;
text-align: center;
}
.lia .huoqu{
height:100%;
width:29%;
float: right;
line-height:82rpx;
text-align: center;
color:#fff;
font-size: 24rpx;
}
wx.js
data: {
bg:‘#E02020‘,
time : 10,
yzm:‘获取验证码‘,
second:‘10‘,
flag:‘huoqu‘
},
// 获取验证码
huoqu:function(){
var that = this;
if (that.data.time == 0){
that.setData({
yzm:‘重新发送‘,
flag:‘huoqu‘,
bg:‘#E02020‘,
time:‘10‘,
})
}else{
that.setData({
yzm: that.data.time-- + ‘s后重新获取‘,
flag:‘‘,
bg:‘#ccc‘,
})
setTimeout(function () {
that.huoqu()
}, 1000)
}
},