微信小程序使用JS实现注册60s倒计时功能

这篇文章主要介绍了微信小程序注册60s倒计时功能，以及使用js实现注册60s倒计时功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

微信小程序+WEB使用JS实现注册【60s】倒计时功能开发步骤：

1、效果图： 

2、页面仅仅利用了JS的相关功能，包含：wxml、js、wxss 

2.1wxml页面代码：

 text 绑定手机 /text 
 form bindsubmit= bindMobile 
 view >
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: #39; #39;,
 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端或者移动端的应该是什么样呢？
其实，方法都差不多，这里也贴出来仅供大家参考
 !-- 这段代码(html)是从脚本之家挪过来的，信誉度应该是很高的，大家可以放心使用 -- 
 script src= http://libs.baidu.com/jquery/1.10.2/jquery.min.js /script 
 script type= text/javascript 
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) 
 /script 
 body 
 input type= button id= btn value= 免费获取验证码 quot;settime(this) / 
 /body 
 /html 
以上就是微信小程序使用JS实现注册60s倒计时功能的详细内容，更多请关注php中文网其它相关文章！
 
  
 微信app下载
 
微信是一款手机通信软件，支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊，还能根据地理位置找到附近的人，带给大家全新的移动沟通体验，有需要的小伙伴快来保存下载体验吧！