js发送短信倒计时的简单实现方法


Posted in Javascript onSeptember 08, 2016

如下所示:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta charset="utf-8">
<head>
<script src="jquery-2.1.4.min.js" type="text/javascript"></script>
<script type="text/javascript">

var InterValObj; //timer变量,控制时间
var count = 120; //间隔函数,1秒执行
var curCount;//当前剩余秒数

function sendMessage() {
  curCount = count;
//设置button效果,开始计时
   $("#btnSendCode").attr("disabled", "true");
   $("#btnSendCode").val("请在" + curCount + "秒内输入验证码");
   InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器,1秒执行一次

 //向后台发送处理数据
   $.ajax({
   
type: "POST", //用POST方式传输
   
dataType: "text", //数据格式:JSON
   
url: 'Login.ashx', //目标地址
  
 data: "dealType=" + dealType +"&uid=" + uid + "&code=" + code,
  
 error: function (XMLHttpRequest, textStatus, errorThrown) { },
   
success: function (msg){ }
   });
}

//timer处理函数
function SetRemainTime() {
      if (curCount == 0) {        
        window.clearInterval(InterValObj);//停止计时器
        $("#btnSendCode").removeAttr("disabled");//启用按钮
        $("#btnSendCode").val("重新发送验证码");
      }
      else {
        curCount--;
        $("#btnSendCode").val("请在" + curCount + "秒内输入验证码");
      }
    }
</script>
</head>
<body>
    <input id="btnSendCode" type="button" value="发送验证码" onclick="sendMessage()" /></p>
</body>
</html>

以上这篇js发送短信倒计时的简单实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype Hash对象 学习
Jul 19 Javascript
JS和函数式语言的三特性
Mar 05 Javascript
JavaScript前端图片加载管理器imagepool使用详解
Dec 29 Javascript
js实现从中间开始往上下展开网页窗口的方法
Mar 02 Javascript
Grunt入门教程(自动任务运行器)
Aug 06 Javascript
详解jquery事件delegate()的使用方法
Jan 25 Javascript
JQuery实现动态操作表格
Jan 11 Javascript
Angular中$broadcast和$emit的使用方法详解
May 22 Javascript
jQuery中each循环的跳出和结束实例
Aug 16 jQuery
快速解决select2在bootstrap模态框中下拉框隐藏的问题
Aug 10 Javascript
js实现鼠标拖拽缩放div实例代码
Mar 25 Javascript
有关vue 开发钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案
May 09 Javascript
JavaScript-html标题滚动效果的简单实现
Sep 08 #Javascript
JS 根据子网掩码,网关计算出所有IP地址范围示例
Apr 23 #Javascript
jQuery遍历节点树方法分析
Sep 08 #Javascript
深入理解AngularJS中的ng-bind-html指令和$sce服务
Sep 08 #Javascript
jQuery ready()和onload的加载耗时分析
Sep 08 #Javascript
Angularjs实现mvvm式的选项卡示例代码
Sep 08 #Javascript
JQ选择器_选择同类元素的第N个子元素的实现方法
Sep 08 #Javascript
You might like
php的慢速日志引起的Mysql错误问题分析
2014/05/13 PHP
ThinkPHP基于PHPExcel导入Excel文件的方法
2014/10/15 PHP
浅析PHP文件下载原理
2014/12/25 PHP
通过php删除xml文档内容的方法
2015/01/23 PHP
PHP定时执行任务的3种方法详解
2015/12/21 PHP
php实时倒计时功能实现方法详解
2017/02/27 PHP
Laravel框架实现利用监听器进行sql语句记录功能
2018/06/06 PHP
jQuery 绑定事件到动态创建的元素上的方法实例
2013/08/18 Javascript
jQuery中unbind()方法用法实例
2015/01/19 Javascript
纯javascript实现的小游戏《Flappy Pig》实例
2015/07/27 Javascript
JavaScript实现选择框按比例拖拉缩放的方法
2015/08/04 Javascript
基于jquery实现放大镜效果
2015/08/17 Javascript
基于jQuery实现Accordion手风琴自定义插件
2020/10/13 Javascript
jQuery编写textarea输入字数限制代码
2017/03/23 jQuery
js控制文本框禁止输入特殊字符详解
2017/04/07 Javascript
Angular.Js中ng-include指令的使用与实现
2017/05/07 Javascript
BootStrap selectpicker后台动态绑定数据
2017/06/01 Javascript
JS运动特效之完美运动框架实例分析
2018/01/24 Javascript
JS数组中对象去重操作示例
2019/06/04 Javascript
JS操作Fckeditor的一些常用方法(获取、插入等)
2020/02/19 Javascript
Vue性能优化的方法
2020/07/30 Javascript
JS模拟实现京东快递单号查询
2020/11/30 Javascript
python dict remove数组删除(del,pop)
2013/03/24 Python
python计算牛顿迭代多项式实例分析
2015/05/07 Python
Tensorflow之构建自己的图片数据集TFrecords的方法
2018/02/07 Python
Python3匿名函数lambda介绍与使用示例
2019/05/18 Python
Python: tkinter窗口屏幕居中,设置窗口最大,最小尺寸实例
2020/03/04 Python
西班牙创意礼品和小工具网上商店:Curiosite
2016/07/26 全球购物
Sneaker Studio匈牙利:购买运动鞋
2018/03/26 全球购物
香港最大的洋酒零售连锁店:屈臣氏酒窖(Watson’s Wine)
2018/12/10 全球购物
The Body Shop美体小铺西班牙官网:天然化妆品
2019/06/21 全球购物
澳大利亚有机化妆品网上商店:The Well Store
2020/02/20 全球购物
年会搞笑主持词串词
2014/03/24 职场文书
对外汉语专业大学生职业生涯规划书
2014/10/11 职场文书
学校证明范文
2015/06/24 职场文书
Django给表单添加honeypot验证增加安全性
2021/05/06 Python