基于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 相关文章推荐
地址栏上的一段语句,改变页面的风格。(教程)
Apr 02 Javascript
jQuery学习3:操作元素属性和特性
Feb 07 Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
Mar 03 Javascript
JavaScript实现将xml转换成html table表格的方法
Apr 17 Javascript
jQuery 1.9.1源码分析系列(十五)动画处理之缓动动画核心Tween
Dec 03 Javascript
jQuery中过滤器的基本用法示例
Oct 11 jQuery
教你用Cordova打包Vue项目的方法
Oct 17 Javascript
用js实现每隔一秒刷新时间的实例(含年月日时分秒)
Oct 25 Javascript
angular4笔记系列之内置指令小结
Nov 09 Javascript
React父子组件间的传值的方法
Nov 13 Javascript
element-ui多文件上传的实现示例
Apr 10 Javascript
浅析Vue 防抖与节流的使用
Nov 14 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 excel reader读取excel内容存入数据库实现代码
2012/12/06 PHP
PHP批量采集下载美女图片的实现代码
2013/06/03 PHP
php简单防盗链实现方法
2015/07/29 PHP
编写PHP脚本使WordPress的主题支持Widget侧边栏
2015/12/14 PHP
分享8个Laravel模型时间戳使用技巧小结
2020/02/12 PHP
PHP生成图表pChart的示例解析
2020/07/31 PHP
JS 日期验证正则附asp日期格式化函数
2009/09/11 Javascript
JavaScript 常用函数库详解
2009/10/21 Javascript
JS关闭窗口或JS关闭页面的几种代码分享
2013/10/25 Javascript
JavaScript实现网页截图功能
2014/10/16 Javascript
为JS扩展Array.prototype.indexOf引发的问题及解决办法
2015/01/21 Javascript
javascript实现在线客服效果
2015/07/15 Javascript
js防阻塞加载的实现方法
2016/09/09 Javascript
微信小程序 下拉列表的实现实例代码
2017/03/08 Javascript
深入解析Vue 组件命名那些事
2017/07/18 Javascript
详解vue-cli构建项目反向代理配置
2017/09/07 Javascript
JS中判断某个字符串是否包含另一个字符串的五种方法
2018/05/03 Javascript
vux uploader 图片上传组件的安装使用方法
2018/05/15 Javascript
解决vue中post方式提交数据后台无法接收的问题
2018/08/11 Javascript
JavaScript原型对象原理与应用分析
2018/12/27 Javascript
Vue 实现手动刷新组件的方法
2019/02/19 Javascript
vue下载excel的实现代码后台用post方法
2019/05/10 Javascript
JavaScript JSON数据处理全集(小结)
2019/08/15 Javascript
Python中pow()和math.pow()函数用法示例
2018/02/11 Python
Python实现链表反转的方法分析【迭代法与递归法】
2020/02/22 Python
Python并发concurrent.futures和asyncio实例
2020/05/04 Python
详解python UDP 编程
2020/08/24 Python
巴基斯坦购物网站:Goto
2019/03/11 全球购物
杭州时比特电子有限公司SQL
2013/08/22 面试题
外贸销售员求职的自我评价
2013/11/23 职场文书
财产保全担保书范文
2014/04/01 职场文书
调研座谈会发言材料
2014/08/23 职场文书
学习实践科学发展观心得体会
2014/09/10 职场文书
合作协议书模板
2014/10/10 职场文书
2014年六五普法工作总结
2014/11/25 职场文书
Python基础之pandas数据合并
2021/04/27 Python