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分页脚本
May 21 Javascript
jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR错误
Jan 11 Javascript
javascript中的void运算符语法及使用介绍
Mar 10 Javascript
js中top的作用深入剖析
Mar 04 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
Jun 10 Javascript
基于JavaScript怎么实现让歌词滚动播放
Nov 03 Javascript
使用jQuery制作遮罩层弹出效果的极简实例分享
May 12 Javascript
jQuery动态修改字体大小的方法【测试可用】
Sep 09 Javascript
微信小程序实现自定义加载图标功能
Jul 19 Javascript
vue中rem的配置的方法示例
Aug 30 Javascript
Element Dialog对话框的使用示例
Jul 26 Javascript
解决ant Design Search无法输入内容的问题
Oct 29 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中使用Oracle数据库(1)
2006/10/09 PHP
PHP函数shuffle()取数组若干个随机元素的方法分析
2016/04/02 PHP
php+mysql实现的二级联动菜单效果详解
2016/05/10 PHP
在TP5数据库中四个字段实现无限分类的示例
2019/10/18 PHP
javascript中interval与setTimeOut的区别示例介绍
2014/03/14 Javascript
jquery append()方法与html()方法的区别及使用介绍
2014/08/01 Javascript
express的中间件basicAuth详解
2014/12/04 Javascript
js的toLowerCase方法用法实例
2015/01/27 Javascript
JavaScript函数详解
2015/02/27 Javascript
javascript中undefined与null的区别
2015/08/16 Javascript
jQuery使用contains过滤器实现精确匹配方法详解
2016/02/25 Javascript
在js代码拼接dom对象到页面上去的模板总结(必看)
2017/02/14 Javascript
防止重复发送 Ajax 请求
2017/02/15 Javascript
基于jquery日历价格、库存等设置插件
2020/07/05 jQuery
angular实现spa单页面应用实例
2017/07/10 Javascript
[01:18]PWL开团时刻DAY10——一拳超人
2020/11/11 DOTA
Python封装shell命令实例分析
2015/05/05 Python
Python实现代码统计工具(终极篇)
2016/07/04 Python
python 接口测试response返回数据对比的方法
2018/02/11 Python
使用python读取txt文件的内容,并删除重复的行数方法
2018/04/18 Python
Python实现定时执行任务的三种方式简单示例
2019/03/30 Python
从0开始的Python学习014面向对象编程(推荐)
2019/04/02 Python
python ubplot使用方法解析
2020/01/10 Python
python 实现仿微信聊天时间格式化显示的代码
2020/04/17 Python
Python过滤序列元素的方法
2020/07/31 Python
Famous Footwear加拿大:美国多品牌运动休闲鞋店
2018/12/05 全球购物
英国最大的户外商店:Go Outdoors
2019/04/17 全球购物
美国基督教约会网站:ChristianCafe.com
2020/02/04 全球购物
在校硕士自我鉴定
2014/01/23 职场文书
高中物理教学反思
2014/02/08 职场文书
教师通用专业自荐书范文
2014/02/11 职场文书
2014党员四风对照检查材料思想汇报
2014/09/17 职场文书
个人政风行风自查自纠报告
2014/10/21 职场文书
2014年人事科工作总结
2014/11/19 职场文书
借条格式范本
2015/05/25 职场文书
电影焦裕禄观后感
2015/06/09 职场文书