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压缩利器
Feb 20 Javascript
js清空form表单中的内容示例
May 20 Javascript
jQuery使用height()获取高度需要注意的地方
Dec 13 Javascript
javascript正则表达式中的replace方法详解
Apr 20 Javascript
被遗忘的javascript的slice() 方法
Apr 20 Javascript
jQuery前端开发35个小技巧
May 24 Javascript
微信小程序 教程之WXML
Oct 18 Javascript
JS实现滑动门效果的方法详解
Dec 19 Javascript
对vue2.0中.vue文件页面跳转之.$router.push的用法详解
Aug 24 Javascript
微信小程序图表插件wx-charts用法实例详解
May 20 Javascript
Vue 实现简易多行滚动&quot;弹幕&quot;效果
Jan 02 Javascript
vue 页面回退mounted函数不执行的解决方案
Jul 26 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和ACCESS写聊天室(三)
2006/10/09 PHP
php数组一对一替换实现代码
2012/08/31 PHP
php+xml实现在线英文词典之添加词条的方法
2015/01/23 PHP
使用phpQuery获取数组的实例
2017/03/13 PHP
php字符串截取函数mb_substr用法实例分析
2019/06/25 PHP
无语,javascript居然支持中文(unicode)编程!
2007/04/12 Javascript
ie下动态加态js文件的方法
2011/09/13 Javascript
node.js中的fs.rename方法使用说明
2014/12/16 Javascript
关于vue.js弹窗组件的知识点总结
2016/09/11 Javascript
Bootstrap模态框调用功能实现方法
2016/09/19 Javascript
微信小程序 PHP生成带参数二维码
2017/02/21 Javascript
基于JavaScript实现类名的添加与移除
2017/04/23 Javascript
vue 微信授权登录解决方案
2018/04/10 Javascript
JS实现的简单下拉框联动功能示例
2018/05/11 Javascript
AngularJS实现的鼠标拖动画矩形框示例【可兼容IE8】
2019/05/17 Javascript
vue-cli随机生成port源码的方法
2019/09/02 Javascript
python通过openpyxl生成Excel文件的方法
2015/05/12 Python
Python程序员面试题 你必须提前准备!(答案及解析)
2018/01/23 Python
Python实现按照指定要求逆序输出一个数字的方法
2018/04/19 Python
Diango + uwsgi + nginx项目部署的全过程(可外网访问)
2018/04/22 Python
python使用PIL实现多张图片垂直合并
2019/01/15 Python
关于 Python opencv 使用中的 ValueError: too many values to unpack
2019/06/28 Python
pyinstaller参数介绍以及总结详解
2019/07/12 Python
基于Python编写一个计算器程序,实现简单的加减乘除和取余二元运算
2020/08/05 Python
分享一个python的aes加密代码
2020/12/22 Python
固特异美国在线轮胎店:Goodyear Tire
2019/02/23 全球购物
碧欧泉法国官网:Biotherm法国
2019/10/23 全球购物
初中生自我评价
2014/02/01 职场文书
会计专业大学生职业生涯规划书
2014/02/11 职场文书
《乞巧》教学反思
2014/02/27 职场文书
《狼和小羊》教学反思
2014/04/20 职场文书
教师批评与自我批评
2014/10/15 职场文书
运动会加油稿
2015/07/22 职场文书
2019最新校园运动会广播稿!
2019/06/28 职场文书
python中%格式表达式实例用法
2021/06/18 Python
Java实现带图形界面的聊天程序
2022/06/10 Java/Android