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下的动画处理总结
Oct 10 Javascript
JavaScript操作Oracle数据库示例
Mar 06 Javascript
测试IE浏览器对JavaScript的AngularJS的兼容性
Jun 19 Javascript
JavaScript实现iframe自动高度调整和不同主域名跨域
Feb 27 Javascript
js实现自定义进度条效果
Mar 15 Javascript
canvas绘制一个常用的emoji表情
Mar 30 Javascript
Bootstrap fileinput文件上传组件使用详解
Jun 06 Javascript
20170918 前端开发周报之JS前端开发必看
Sep 18 Javascript
详解vue-cli项目中怎么使用mock数据
May 29 Javascript
Javascript 之封装(Package)
Sep 14 Javascript
小程序云开发初探(小结)
Oct 24 Javascript
Vue框架下引入ActiveX控件的问题解决
Mar 25 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
destoon实现调用自增数字从1开始的方法
2014/08/21 PHP
php源码分析之DZX1.5加密解密函数authcode用法
2015/06/17 PHP
PHP批斗大会之缺失的异常详解
2019/07/09 PHP
php进程(线程)通信基础之System V共享内存简单实例分析
2019/11/09 PHP
关于jQuery UI 使用心得及技巧
2012/10/10 Javascript
详解Angular.js指令中scope类型的几种特殊情况
2017/02/21 Javascript
利用原生JS与jQuery实现数字线性变化的动画
2017/02/24 Javascript
jquery Form轻松实现文件上传
2017/05/24 jQuery
vue页面离开后执行函数的实例
2018/03/13 Javascript
js最实用string(字符串)类型的使用及截取与拼接详解
2019/04/26 Javascript
微信小程序swiper禁止用户手动滑动代码实例
2019/08/23 Javascript
微信小程序通过js实现瀑布流布局详解
2019/08/28 Javascript
浅谈vue-router路由切换 组件重用挖下的坑
2019/11/01 Javascript
微信小程序使用 vant Dialog组件的正确方式
2020/02/21 Javascript
JS正则表达式常见函数与用法小结
2020/04/13 Javascript
JavaScript设计模式之观察者模式与发布订阅模式详解
2020/05/07 Javascript
Vue实现input宽度随文字长度自适应操作
2020/07/29 Javascript
[01:07]DOTA2次级职业联赛 - Fpb战队宣传片
2014/12/01 DOTA
python改变日志(logging)存放位置的示例
2014/03/27 Python
简单讲解Python中的字符串与字符串的输入输出
2016/03/13 Python
python3 实现口罩抽签的功能
2020/03/11 Python
python由已知数组快速生成新数组的方法
2020/04/08 Python
python怎么判断模块安装完成
2020/06/19 Python
Python中实现一行拆多行和多行并一行的示例代码
2020/09/06 Python
香港化妆品经销商:我的公主
2016/08/05 全球购物
雅诗兰黛(Estee Lauder)英国官方网站:世界顶级化妆品牌
2016/12/29 全球购物
Jacadi Paris美国官方网站:法国童装品牌
2017/10/15 全球购物
任意存:BOXFUL
2018/05/21 全球购物
劳力士官方珠宝商:J.R. Dunn Jewelers
2018/09/29 全球购物
linux面试题参考答案(5)
2016/11/05 面试题
装潢设计实习自我鉴定
2013/09/19 职场文书
智能电子应届生求职信
2013/11/10 职场文书
大学毕业感言200字
2014/03/09 职场文书
优秀教师感人事迹材料
2014/05/04 职场文书
2015年维修电工工作总结
2015/04/25 职场文书
JavaScript canvas实现流星特效
2021/05/20 Javascript