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 相关文章推荐
JQuery 获得绝对,相对位置的坐标方法
Feb 09 Javascript
基于JQuery实现鼠标点击文本框显示隐藏提示文本
Feb 23 Javascript
jQuery异步获取json数据方法汇总
Dec 22 Javascript
IE9+已经不对document.createElement向下兼容的解决方法
Sep 14 Javascript
js获取所有checkbox的值的简单实例
May 30 Javascript
jQuery实现鼠标经过显示动画边框特效
Mar 24 jQuery
jQuery制作全屏宽度固定高度轮播图(实例讲解)
Jul 08 jQuery
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
Aug 14 Javascript
分析javascript中9 个常见错误阻碍你进步
Sep 18 Javascript
Vuex mutitons和actions初使用详解
Mar 04 Javascript
react PropTypes校验传递的值操作示例
Apr 28 Javascript
一定要知道的 25 个 Vue 技巧
Nov 02 Vue.js
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
laravel按天、按小时,查询数据的实例
2019/10/09 PHP
php生成HTML文件的类方法
2019/10/11 PHP
javascript 三种方法实现获得和设置以及移除元素属性
2013/03/20 Javascript
JQuery实现防止退格键返回的方法
2015/02/12 Javascript
基于javascript实现单选及多选的向右和向左移动实例
2015/07/25 Javascript
jQuery实现的经典滑动门效果
2015/09/22 Javascript
Javascript中indexOf()和lastIndexOf应用方法实例
2016/08/24 Javascript
AngularJS 过滤器(自带和自建)详解
2016/09/19 Javascript
js实现消息滚动效果
2017/01/18 Javascript
JS实现的五级联动菜单效果完整实例
2017/02/23 Javascript
JavaScript取得gridview中获取checkbox选中的值
2017/07/24 Javascript
jQuery实现模糊搜索功能的方法分析
2018/06/29 jQuery
[01:00:10]完美世界DOTA2联赛PWL S2 FTD vs Inki 第二场 11.21
2020/11/24 DOTA
python清除字符串里非数字字符的方法
2015/07/02 Python
python使用正则表达式替换匹配成功的组
2017/11/17 Python
详谈Python中列表list,元祖tuple和numpy中的array区别
2018/04/18 Python
python 字符串和整数的转换方法
2018/06/25 Python
Python3实现获取图片文字里中文的方法分析
2018/12/13 Python
python实现控制台打印的方法
2019/01/12 Python
树莓派使用USB摄像头和motion实现监控
2019/06/22 Python
django drf框架中的user验证以及JWT拓展的介绍
2019/08/12 Python
django 外键创建注意事项说明
2020/05/20 Python
PyTorch 导数应用的使用教程
2020/08/31 Python
html5利用canvas绘画二级树形结构图的示例
2017/09/27 HTML / CSS
护理毕业生自我鉴定
2014/02/11 职场文书
致800米运动员广播稿
2014/02/16 职场文书
机械设计及其自动化求职推荐信
2014/02/17 职场文书
机械工程及自动化专业求职信
2014/09/03 职场文书
纪念九一八事变83周年国旗下讲话稿
2014/09/15 职场文书
工商局领导班子存在的问题整改措施思想汇报
2014/10/05 职场文书
小学生安全教育广播稿
2014/10/20 职场文书
自荐信怎么写
2015/03/04 职场文书
2016寒假社会实践心得体会范文
2015/10/09 职场文书
2016年最美孝心少年事迹材料
2016/02/26 职场文书
Django实现在线无水印抖音视频下载(附源码及地址)
2021/05/06 Python
一次SQL如何查重及去重的实战记录
2022/03/13 MySQL