基于JavaScript实现手机短信按钮倒计时(超简单)


Posted in Javascript onDecember 30, 2015

在淘宝等购物网站,我们都会看到一个发送短信倒计时的按钮,究竟是如何实现的呢?下面我就给大家提供一段代码很实用的。

废话不多说了,直接给大家贴js代码了。

/*
 120秒手机短信按钮倒计时
 */
 exports.sendmessage = function (name) {
  var second = 120;
  $(name).attr("disabled", true);
  var color = $(name).css('background-color');
  $(name).attr("style", "background-color : #c1c1c1");
  function update(num) {
   if (num == second) {
    $(name).attr("style", "background-color : "+color);
    $(name).text("获取验证码");
    $(name).attr("disabled", false);
   }
   else {
    var printnr = second - num;
    $(name).text(printnr + "秒后获取");
   }
  }
  function uupdate(i) {
   return function () {
    update(i);
   }
  }
  for (var i = 1; i <= second; i++) {
   setTimeout(uupdate(i), i * 1000);
  }
 }

以上代码是本文给大家介绍的JavaScript实现手机短信按钮倒计时的全部叙述,希望大家喜欢。

Javascript 相关文章推荐
强悍无比的WEB开发好助手FireBug(Firefox Plugin)
Jan 16 Javascript
用Div仿showModalDialog模式菜单的效果的代码
Mar 05 Javascript
jquery ui dialog ie8出现滚动条的解决方法
Dec 06 Javascript
JS判断是否360安全浏览器极速内核的方法
Jan 29 Javascript
jquery实现点击label的同时触发文本框点击事件的方法
Jun 05 Javascript
彻底解决 webpack 打包文件体积过大问题
Jul 07 Javascript
webpack 1.x升级过程中的踩坑总结大全
Aug 09 Javascript
JavaScript实现的仿新浪微博原生态输入字数即时检查功能【兼容IE6】
Sep 26 Javascript
jquery实现楼层滚动效果
Jan 01 jQuery
js隐式转换的知识实例讲解
Sep 28 Javascript
JS实现随机抽选获奖者
Nov 07 Javascript
JS 数组和对象的深拷贝操作示例
Jun 06 Javascript
Highcharts使用简例及异步动态读取数据
Dec 30 #Javascript
JavaScript阻止回车提交表单的方法
Dec 30 #Javascript
基于JavaScript代码实现微信扫一扫下载APP
Dec 30 #Javascript
分享两款带遮罩的jQuery弹出框
Dec 30 #Javascript
JavaScript小技巧整理
Dec 30 #Javascript
jQuery拖动元素并对元素进行重新排序
Dec 30 #Javascript
jQuery给元素添加样式的方法详解
Dec 30 #Javascript
You might like
解析php获取字符串的编码格式的方法(函数)
2013/06/21 PHP
PHP日期和时间函数的使用示例详解
2020/08/06 PHP
jquery插件制作教程 txtHover
2012/08/17 Javascript
JS分页控件 可用于无刷新分页
2013/07/23 Javascript
JavaScript 32位整型无符号操作示例
2013/12/08 Javascript
javascript中的undefined和not defined区别示例介绍
2014/02/26 Javascript
对比分析json及XML
2014/11/28 Javascript
使用javascript实现简单的选项卡切换
2015/01/09 Javascript
jQueryUI DatePicker 添加时分秒
2016/06/04 Javascript
js实现上传图片预览方法
2016/10/25 Javascript
nodejs进阶(6)—连接MySQL数据库示例
2017/01/07 NodeJs
利用Vue.js实现checkbox的全选反选效果
2017/01/18 Javascript
浅谈键盘上回车按钮的js触发事件
2017/02/13 Javascript
View.post() 不靠谱的地方你知道多少
2017/08/29 Javascript
vue配置请求本地json数据的方法
2018/04/11 Javascript
微信小程序template模版的使用方法
2019/04/13 Javascript
js Array.slice的8种不同用法示例
2019/07/10 Javascript
Weex开发之WEEX-EROS开发踩坑(小结)
2019/10/16 Javascript
react 原生实现头像滚动播放的示例
2020/04/21 Javascript
基于JavaScript实现表格隔行换色
2020/05/08 Javascript
彻底搞懂并解决vue-cli4中图片显示的问题实现
2020/08/31 Javascript
Python全排列操作实例分析
2018/07/24 Python
Python基于SMTP协议实现发送邮件功能详解
2018/08/14 Python
深入了解和应用Python 装饰器 @decorator
2019/04/02 Python
python使用pymongo操作mongo的完整步骤
2019/04/13 Python
python顺序执行多个py文件的方法
2019/06/29 Python
Python类继承和多态原理解析
2020/02/05 Python
Python3以GitHub为例来实现模拟登录和爬取的实例讲解
2020/07/30 Python
CSS3中线性颜色渐变的一些实现方法
2015/07/14 HTML / CSS
10种CSS3实现的loading动画,挑一个走吧?
2020/11/16 HTML / CSS
苹果台湾官网:Apple台湾
2019/01/05 全球购物
法国床上用品商店:La Compagnie du lit
2019/12/26 全球购物
高一物理教学反思
2014/01/24 职场文书
服装设计专业自荐信
2014/06/17 职场文书
2014年银行个人工作总结
2014/12/05 职场文书
TypeScript实用技巧 Nominal Typing名义类型详解
2022/09/23 Javascript