这篇文章主要介绍了微信小程序使用JS实现注册60s倒计时功能的示例，具有一定借鉴价值，感兴趣的朋友可以参考下，希望大家阅读完这篇文章之后大有收获，下面让小编带着大家一起了解一下。
专注于为中小企业提供成都网站制作、网站设计服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业彭州免费做网站提供优质的服务。我们立足成都，凝聚了一批互联网行业人才，有力地推动了上1000家企业的稳健成长，帮助中小企业通过网站建设实现规模扩充和转变。
微信小程序+WEB使用JS实现注册【60s】倒计时功能开发步骤：
1、效果图：
2、页面仅仅利用了JS的相关功能，包含：wxml、js、wxss
2.1wxml页面代码：
绑定手机
手 机：
获取验证码
重新发送{{last_time}}秒
确认绑定
2.2 js页面代码：
var countdown = 60;
var settime = function (that) {
if (countdown == 0) {
that.setData({
is_show: true
})
countdown = 60;
return;
} else {
that.setData({
is_show:false,
last_time:countdown
})
countdown--;
}
setTimeout(function () {
settime(that)
}
, 1000)
}
Page({
/**
* 页面的初始数据
*/
data: {
last_time:'',
is_show:true
},
clickVerify:function(){
var that = this;
// 将获取验证码按钮隐藏60s，60s后再次显示
that.setData({
is_show: (!that.data.is_show) //false
})
settime(that);
}
})2.3 wxss页面代码：
/* 发送验证码按钮隐藏，并展示倒数60s提示 */
.hide{
display: none;
}
.show{
display: block;
}3、上面讲的是微信小程序的，那么我们一般web端或者移动端的应该是什么样呢？
其实，方法都差不多，这里也贴出来仅供大家参考
var countdown=60;
function settime(obj) {
if (countdown == 0) {
obj.removeAttribute("disabled");
obj.value="免费获取验证码";
countdown = 60;
return;
} else {
obj.setAttribute("disabled", true);
obj.value="重新发送(" + countdown + ")";
countdown--;
}
setTimeout(function() {
settime(obj) }
,1000)
}
