基于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 相关文章推荐
jquery操作select option 的代码小结
Jun 21 Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 Javascript
Javascript中的getUTCDay()方法使用详解
Jun 10 Javascript
javascript中window.open在原来的窗口中打开新的窗口(不同名)
Nov 15 Javascript
JS+Canvas 实现下雨下雪效果
May 18 Javascript
javaScript知识点总结(必看篇)
Jun 10 Javascript
Vue.js第三天学习笔记(计算属性computed)
Dec 01 Javascript
jQuery插件HighCharts绘制2D柱状图、折线图和饼图的组合图效果示例【附demo源码下载】
Mar 09 Javascript
javascript帧动画(实例讲解)
Sep 02 Javascript
解决vue热替换失效的根本原因
Sep 19 Javascript
vue canvas绘制矩形并解决由clearRec带来的闪屏问题
Sep 02 Javascript
Vue实现跑马灯样式文字横向滚动
Nov 23 Vue.js
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实现的获取URL信息的类
2007/01/02 PHP
PHP 加密与解密的斗争
2009/04/17 PHP
PHP删除数组中的特定元素的代码
2012/06/28 PHP
PHP多文件上传实例
2015/07/09 PHP
PHP简单数据库操作类实例【支持增删改查及链式操作】
2016/10/10 PHP
基于jquery的textarea发布框限制文字字数输入(添加中文识别)
2012/02/16 Javascript
JavaScript window.document的属性、方法和事件小结
2012/10/24 Javascript
jquery插件开发注意事项小结
2013/06/04 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
2013/07/01 Javascript
Javascript快速排序算法详解
2014/12/03 Javascript
28个常用JavaScript方法集锦
2015/01/14 Javascript
JS实现文字链接感应鼠标淡入淡出改变颜色的方法
2015/02/26 Javascript
JavaScript判断字符长度、数字、Email、电话等常用判断函数分享
2015/04/01 Javascript
JavaScript操作HTML元素和样式的方法详解
2015/10/21 Javascript
浅析BootStrap栅格系统
2016/06/07 Javascript
jquery实现焦点轮播效果
2017/02/23 Javascript
详解angularjs 关于ui-router分层使用
2017/06/12 Javascript
Vue 重置组件到初始状态的方法示例
2018/10/10 Javascript
javascript 高级语法之继承的基本使用方法示例
2019/11/11 Javascript
Vue 中 a标签上href无法跳转的解决方式
2019/11/12 Javascript
24个ES6方法解决JS实际开发问题(小结)
2020/05/31 Javascript
教大家玩转Python字符串处理的七种技巧
2017/03/31 Python
Python遍历文件夹和读写文件的实现方法
2017/05/10 Python
django session完成状态保持的方法
2018/11/27 Python
PyCharm的设置方法和第一个Python程序的建立
2019/01/16 Python
Pandas统计重复的列里面的值方法
2019/01/30 Python
全面了解django的缓存机制及使用方法
2019/07/22 Python
python tkinter实现屏保程序
2019/07/30 Python
用Python实现二叉树、二叉树非递归遍历及绘制的例子
2019/08/09 Python
Wiggle美国:英国骑行、跑步、游泳、铁人三项商店
2018/10/27 全球购物
2014迎接教师节演讲稿
2014/09/10 职场文书
结婚纪念日感言
2015/08/01 职场文书
数据结构课程设计心得体会
2016/01/15 职场文书
2016大学生国家助学贷款承诺书
2016/03/25 职场文书
用javascript制作qq注册动态页面
2021/04/14 Javascript
MySQL8.0.24版本Release Note的一些改进点
2021/04/22 MySQL