js判断60秒以及倒计时示例代码


Posted in Javascript onJanuary 24, 2014

用js判断60秒到计时,首先定义一个变量refreshTime,当触发事件的时候检查一下上一次请求成功的时间距离现在是否超过60秒,如果没有超过60秒,则弹出提示,

否则则允许继续请求,请求成功之后,把当前的时间赋值给refreshTime,具体实现方式;

usingNamespace("Biz.AccountCenter")["CellPhoneValidation"]={  
    refreshTime:0, //变量    checkRefreshGet:function(timeLimit) //检查时间,timelimit为传入请求需要间隔的时间(单位秒),比如:60
    {
      var nowTime = new Date();
      var nowMinitePoint=nowTime.getHours()*3600+nowTime.getMinutes()*60+nowTime.getSeconds();

     if(nowMinitePoint-Biz.AccountCenter.CellPhoneValidation.refreshTime<timeLimit )
     {
         return false;
     }
         return true;
    },
    resetRefreshGet:function() //请求成功之后,调用的方法,把定义的变量重置为当前时间
    {
       var nowTime = new Date();
       var nowMinitePoint=nowTime.getHours()*3600+nowTime.getMinutes()*60+nowTime.getSeconds();
       Biz.AccountCenter.CellPhoneValidation.refreshTime=nowMinitePoint; 
    },
 dynamicMessage:function(timeSecond) //倒计时方法 timeSecond为从多少秒开始,比如:60
    {
       var showTimmer;
       if (showTimmer) {
           clearTimeout(showTimmer);
       }
       if(timeSecond==dynamicValidate.refreshTimeLimit)
       {
            var messageRefresh =$.newegg.format(dynamicValidate.refreshSpanMessage,timeSecond);
           $("#spanRefresh").html("<span>"+messageRefresh+"</span>");
            $("#spanRefresh").attr("class","button btn_yanz_disable");
           timeSecond--;
       }
       showTimmer = setTimeout(function () {
           var messageRefresh =$.newegg.format(dynamicValidate.refreshSpanMessage,timeSecond);
           $("#spanRefresh").html("<span>"+messageRefresh+"</span>");
           timeSecond--;
           if (timeSecond < 0) {
               clearTimeout(showTimmer);
               $("#spanRefresh").attr("class","button btn_yanz");
               $("#spanRefresh").html("<span>"+dynamicValidate.refreshMessage+"</span>");
           } else {
               Biz.AccountCenter.CellPhoneValidation.dynamicMessage(timeSecond);
                $("#spanRefresh").attr("class","button btn_yanz_disable");
           }
       }, 1000);
    },
    create: function(obj,page,isCancelPhone) //每次请求调用的方法
    {     
        if(!Biz.AccountCenter.CellPhoneValidation.checkRefreshGet(dynamicValidate.refreshTimeLimit)) //每次请求的时候,js检查60s时间间隔
        {
           $("#valiateerror").empty().html("<span class='Validform_wrong'>"+$.newegg.format($Resource.BuildContent("AccountCenter_ModifyDyanmic_CanNotRepeatClick"),dynamicValidate.refreshTimeLimit)+"</span>").show();
           $("#mobilewarning").hide();
           return;
        }
       $.get("url",data,function(){
             //如果成功
             Biz.AccountCenter.CellPhoneValidation.dynamicMessage(dynamicValidate.refreshTimeLimit);//倒计时
             Biz.AccountCenter.CellPhoneValidation.resetRefreshGet();//重置时间
       });
        
    }
 }
Javascript 相关文章推荐
jQuery下实现等待指定元素加载完毕(可改成纯js版)
Jul 11 Javascript
JavaScript 不支持 indexof 该如何解决
Mar 30 Javascript
5个最顶级jQuery图表类库插件【jquery插件库】
May 05 Javascript
快速使用Bootstrap搭建传送带
May 06 Javascript
JQuery点击事件回到页面顶部效果的实现代码
May 24 Javascript
微信小程序开发之相册选择和拍照详解及实例代码
Feb 22 Javascript
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
Apr 17 jQuery
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
Sep 30 Javascript
vue-cli V3.0版本的使用详解
Oct 24 Javascript
javascript sort()对数组中的元素进行排序详解
Oct 13 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
Oct 23 Javascript
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
Nov 14 Javascript
innerText 使用示例
Jan 23 #Javascript
登陆成功后自动计算秒数执行跳转
Jan 23 #Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
Jan 23 #Javascript
html dom节点操作(获取/修改/添加或删除)
Jan 23 #Javascript
解决jquery插件冲突的问题
Jan 23 #Javascript
js实现日期级联效果
Jan 23 #Javascript
js日期、星座的级联显示代码
Jan 23 #Javascript
You might like
PHP获取photoshop写入图片文字信息的方法
2015/03/31 PHP
PHP也能干大事 随机函数
2015/04/14 PHP
使用Entrust扩展包在laravel 中实现RBAC的功能
2020/03/16 PHP
jQuery+CSS 半开折叠效果原理及代码(自写)
2013/03/04 Javascript
JavaScript面向对象的实现方法小结
2015/04/14 Javascript
Bootstrap Tooltip显示换行和左对齐的解决方案
2017/10/11 Javascript
JS扩展String.prototype.format字符串拼接的功能
2018/03/09 Javascript
vue 中使用 watch 出现了如下的报错的原因分析
2019/05/21 Javascript
微信小程序 WXML节点信息查询详解
2019/07/29 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
2019/09/16 Javascript
微信小程序实现音乐播放器
2019/11/20 Javascript
高效jQuery选择器的5个技巧实例分析
2019/11/26 jQuery
vue页面加载时的进度条功能(实例代码)
2020/01/13 Javascript
《javascript设计模式》学习笔记五:Javascript面向对象程序设计工厂模式实例分析
2020/04/08 Javascript
JavaScript面向对象核心知识与概念归纳整理
2020/05/09 Javascript
[00:35]DOTA2上海特级锦标赛 VP战队宣传片
2016/03/04 DOTA
Python作用域用法实例详解
2016/03/15 Python
python提取xml里面的链接源码详解
2019/10/15 Python
详解如何在登录过期后跳出Ifram框架
2020/09/10 HTML / CSS
波兰最大的宠物用品网上商店:FERA.PL
2019/08/11 全球购物
在校大学生个人的自我评价
2014/02/13 职场文书
监察建议书范文
2014/03/12 职场文书
程序员求职信
2014/04/16 职场文书
学习三严三实对照检查材料思想汇报
2014/09/22 职场文书
教师党的群众路线教育实践活动学习心得体会
2014/10/30 职场文书
保证书格式
2015/01/16 职场文书
2015年财务部工作总结
2015/04/10 职场文书
学习十八大的感悟
2015/08/11 职场文书
python实现自定义日志的具体方法
2021/05/28 Python
关于html选择框创建占位符的问题
2021/06/09 HTML / CSS
windows11怎么查看自己安装的版本号? win11版本号的查看方法
2021/11/21 数码科技
深入讲解Vue中父子组件通信与事件触发
2022/03/22 Vue.js
MySQL创建表操作命令分享
2022/03/25 MySQL
阿里云k8s服务升级时502错误 springboot项目应用
2022/04/09 Servers
Python selenium绕过webdriver监测执行javascript
2022/04/12 Python
使用Nginx+Tomcat实现负载均衡的全过程
2022/05/30 Servers