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 相关文章推荐
跨浏览器的设置innerHTML方法
Sep 18 Javascript
用dom+xhtml+css制作的一个相册效果代码打包下载
Jan 24 Javascript
JavaScript 保存数组到Cookie的代码
Apr 14 Javascript
页面只能打开一次Cooike如何实现
Dec 04 Javascript
Node.js中使用Log.io在浏览器中实时监控日志(等同tail -f命令)
Sep 17 Javascript
node.js中的path.basename方法使用说明
Dec 09 Javascript
jQuery中html()方法用法实例
Dec 25 Javascript
JavaScript 学习笔记之操作符
Jan 14 Javascript
详解React中传入组件的props改变时更新组件的几种实现方法
Sep 13 Javascript
Vue中的组件及路由使用实例代码详解
May 22 Javascript
弱类型语言javascript开发中的一些坑实例小结【变量、函数、数组、对象、作用域等】
Aug 07 Javascript
解决angular 使用原生拖拽页面卡顿及表单控件输入延迟问题
Apr 21 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
咖啡界又出新概念,无需咖啡豆的分子咖啡
2021/03/03 咖啡文化
测试php函数的方法
2013/11/13 PHP
php提示Failed to write session data错误的解决方法
2014/12/17 PHP
浅析PHP类的反射来实现依赖注入过程
2018/02/06 PHP
PHP count()函数讲解
2019/02/03 PHP
编写可维护面向对象的JavaScript代码[翻译]
2011/02/12 Javascript
javascript完美拖拽的实现方法
2013/09/29 Javascript
javascript中with()方法的语法格式及使用
2014/08/04 Javascript
node.js中的fs.readlinkSync方法使用说明
2014/12/17 Javascript
jQuery中end()方法用法实例
2015/01/08 Javascript
jquery获取多个checkbox的值异步提交给php
2015/07/07 Javascript
详解js的延迟对象、跨域、模板引擎、弹出层、AJAX【附实例下载】
2016/12/19 Javascript
jquery.masonry瀑布流效果
2017/05/25 jQuery
JavaScript原型链与继承操作实例总结
2018/08/24 Javascript
JS使用正则表达式判断输入框失去焦点事件
2019/10/16 Javascript
微信小程序canvas开发水果老虎机的思路详解
2020/02/07 Javascript
10分钟学会js处理json的常用方法
2020/12/06 Javascript
在Python的Django框架中生成CSV文件的方法
2015/07/22 Python
Django压缩静态文件的实现方法详析
2018/08/26 Python
Python图像滤波处理操作示例【基于ImageFilter类】
2019/01/03 Python
浅谈Scrapy网络爬虫框架的工作原理和数据采集
2019/02/07 Python
kafka监控获取指定topic的消息总量示例
2019/12/23 Python
Pycharm的Available Packages为空的解决方法
2020/09/18 Python
基于IE10/HTML5 开发
2013/04/22 HTML / CSS
精灵市场:Pixie Market
2019/06/18 全球购物
年度考核自我鉴定
2014/03/19 职场文书
工厂采购员岗位职责
2014/04/08 职场文书
应届大专生自荐书
2014/06/16 职场文书
乡镇计划生育工作汇报
2014/10/28 职场文书
手术室护士个人总结
2015/02/13 职场文书
物业前台接待岗位职责
2015/04/03 职场文书
建筑质检员岗位职责
2015/04/08 职场文书
2015年教务主任工作总结
2015/07/22 职场文书
婚礼父母致辞
2015/07/28 职场文书
MySQL中int (10) 和 int (11) 的区别
2022/01/22 MySQL
springboot+rabbitmq实现智能家居实例详解
2022/07/23 Java/Android