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 相关文章推荐
js实时监听文本框状态的方法
Apr 26 Javascript
javascript 函数及作用域总结介绍
Nov 12 Javascript
jquery复选框全选/取消示例
Dec 30 Javascript
JavaScript两种跨域技术全面介绍
Apr 16 Javascript
初识Javascript小结
Jul 16 Javascript
js实现浮动在网页右侧的简洁QQ在线客服代码
Sep 04 Javascript
js 弹出虚拟键盘修改密码的简单实例
Oct 10 Javascript
利用Node.js检测端口是否被占用的方法
Dec 07 Javascript
Node+OCR实现图像文字识别功能
Nov 26 Javascript
用Cordova打包Vue项目的方法步骤
Feb 02 Javascript
如何使用pm2快速将项目部署到远程服务器
Mar 12 Javascript
详解vue.js移动端配置flexible.js及注意事项
Apr 10 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脚本的10个技巧(2)
2006/10/09 PHP
php使用Jpgraph绘制饼状图的方法
2015/06/10 PHP
document.onreadystatechange事件的用法分析
2009/10/17 Javascript
JavaScript词法作用域与调用对象深入理解
2012/11/29 Javascript
教你如何使用node.js制作代理服务器
2014/11/26 Javascript
JavaScript数组去重的五种方法
2015/11/05 Javascript
Javascript获取background属性中url的值
2016/10/17 Javascript
SpringMVC简单整合Angular2的示例
2017/07/31 Javascript
angularjs2 ng2 密码隐藏显示的实例代码
2017/08/01 Javascript
vue-cli开发环境实现跨域请求的方法
2018/04/07 Javascript
node版本管理工具n包使用教程详解
2018/11/09 Javascript
vue component 中引入less文件报错 Module build failed
2019/04/17 Javascript
原生JavaScript之es6中Class的用法分析
2020/02/23 Javascript
javascript实现滚动条效果
2020/03/24 Javascript
Nuxt 嵌套路由nuxt-child组件用法(父子页面组件的传值)
2020/11/05 Javascript
[54:10]完美世界DOTA2联赛PWL S2 Magma vs FTD 第二场 11.29
2020/12/03 DOTA
flask框架中勾子函数的使用详解
2018/08/01 Python
python爬取淘宝商品销量信息
2018/11/16 Python
使用Python+wxpy 找出微信里把你删除的好友实例
2019/02/21 Python
python smtplib发送多个email联系人的实现
2020/10/09 Python
M1芯片安装python3.9.1的实现
2021/02/02 Python
Python运算符+与+=的方法实例
2021/02/18 Python
浅析python连接数据库的重要事项
2021/02/22 Python
python爬取youtube视频的示例代码
2021/03/03 Python
J.Crew官网:美国知名休闲服装品牌
2017/05/19 全球购物
教你怎样写好自我评价
2013/10/05 职场文书
《童年》教学反思
2014/02/18 职场文书
2014年光棍节活动策划方案(创意集锦)
2014/09/29 职场文书
兼职安全员岗位职责
2015/02/15 职场文书
2015大学生求职信范文
2015/03/20 职场文书
新员工试用期工作总结2015
2015/05/28 职场文书
2015年国庆节寄语
2015/08/17 职场文书
严以用权学习心得体会
2016/01/12 职场文书
Python 中random 库的详细使用
2021/06/03 Python
MySQL 1130异常,无法远程登录解决方案详解
2021/08/23 MySQL
Python实现灰色关联分析与结果可视化的详细代码
2022/03/25 Python