基于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 相关文章推荐
javascript获取选中的文本的方法代码
Oct 30 Javascript
Ajax同步与异步传输的示例代码
Nov 21 Javascript
jquery获取一个元素下面相同子元素的个数代码
Jul 31 Javascript
node.js实现BigPipe详解
Dec 05 Javascript
javascript正则表达式之search()用法实例
Jan 19 Javascript
js实现异步循环实现代码
Feb 16 Javascript
JavaScript 字符串常用操作小结(非常实用)
Nov 30 Javascript
JS触摸与手势事件详解
May 09 Javascript
AngularJS学习笔记之表单验证功能实例详解
Jul 06 Javascript
对angularJs中自定义指令replace的属性详解
Oct 09 Javascript
在vue中使用setInterval的方法示例
Apr 16 Javascript
这15个Vue指令,让你的项目开发爽到爆
Oct 11 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
四月新番又没了,《Re:从零开始的异世界生活》第二季延期至7月播出
2020/05/06 日漫
PHP生成静态页面详解
2006/12/05 PHP
微信支付开发告警通知实例
2016/07/12 PHP
PHP面向对象程序设计继承用法简单示例
2018/12/28 PHP
jquery uaMatch源代码
2011/02/14 Javascript
javascript对JSON数据排序的3个例子
2014/04/12 Javascript
JQuery 在线引用及测试引用是否成功
2014/06/24 Javascript
jQuery焦点图切换特效代码分享
2015/09/15 Javascript
jQuery1.9.1源码分析系列(十六)ajax之ajax框架
2015/12/04 Javascript
JavaScript数组方法总结分析
2016/05/06 Javascript
jQuery绑定事件的四种方式介绍
2016/10/31 Javascript
jQuery Mobile和HTML5开发App推广注册页
2016/11/07 Javascript
微信小程序 二维码canvas绘制实例详解
2017/01/06 Javascript
javascript将list转换成树状结构的实例
2017/09/08 Javascript
基于jQuery解决ios10以上版本缩放问题
2017/11/03 jQuery
详解html-webpack-plugin用法全解
2018/01/22 Javascript
Vue2.x Todo之自定义指令实现自动聚焦的方法
2019/01/08 Javascript
关于微信小程序登录的那些事
2019/01/08 Javascript
了解javascript中的Dom操作
2019/05/27 Javascript
python用字典统计单词或汉字词个数示例
2014/04/22 Python
Python多进程通信Queue、Pipe、Value、Array实例
2014/11/21 Python
python ansible服务及剧本编写
2017/12/29 Python
解决PyCharm同目录下导入模块会报错的问题
2018/10/13 Python
python实现全盘扫描搜索功能的方法
2019/02/14 Python
Python 常用日期处理 -- calendar 与 dateutil 模块的使用
2020/09/02 Python
移动端HTML5开发神器之vconsole详解
2020/12/15 HTML / CSS
一道SQL面试题
2012/12/31 面试题
现金会计岗位职责
2013/12/05 职场文书
辩论赛主持词
2014/03/18 职场文书
竞选大队委员演讲稿
2014/04/28 职场文书
好书伴我成长演讲稿
2014/05/14 职场文书
十八大演讲稿
2014/05/22 职场文书
2014年财务人员工作总结
2014/11/11 职场文书
八年级物理教学反思
2016/02/19 职场文书
选对餐饮营销策略,营业额才会上涨
2019/08/27 职场文书
教你部署vue项目到docker
2022/04/05 Vue.js