多个倒计时切换 开始和结束

/* 
* @Author: Mark
* @Date:   2015-08-06 13:54:01
* @Last Modified by:   Mark
* @Last Modified time: 2015-08-17 11:49:27
*/
var tmover=(function(){
        function tim(opt){
        _this=this;//保存当前对象
        this.timer=null; //设置定时器
        this.opme=Object.prototype.toString.call(opt.obj).slice(8,-1)=="String"?document.querySelectorAll(opt.obj):null; //获取定时器对象
        this.stxt=Object.prototype.toString.call(opt.txtstart).slice(8,-1)=="String"?opt.txtstart:"距离开始"; //设置距离开始的默认值
        this.ltxt=Object.prototype.toString.call(opt.txtstart).slice(8,-1)=="String"?opt.txtlast:"剩余"; //设置剩余的默认值
        for (var i = 0; i < this.opme.length; i++) { //循环当前页面所有定时器
            this.stime=this.opme[i].getAttribute(opt.stat)?this.opme[i].getAttribute(opt.stat):this.opme[i].getAttribute(opt.end); //如果没有距离开始的需求,那就说明只有单个倒计时 
            this.opme[i].flag=1; //设置定时器开关
            this.opme[i].str=""; //设置每个DOM的字符串显示文字
            this.endtime=this.opme[i].getAttribute(opt.end); //获取倒计时
            this.loop({oindex:this.opme[i],
                        oend:_this.endtime,
                        tend:opt.txtend,
                        tstat:_this.stxt,
                        tlast:_this.ltxt,
                        ostm:_this.stime,
                        ck:true
                    }); //初始化倒计时进行
        };
    }
    tim.prototype={
        constructor : 'tmover', //设置原型引用对象为tmover
        move:function(json){ //倒计时计算
            _this.ender=json.ck?new Date(json.ostm).getTime():new Date(json.oend).getTime();//没有开始倒计时 就设置结束倒计时
            _this.stattime=new Date().getTime();
            _this.opatime=_this.ender-_this.stattime; //时间差
            _this.second=(_this.opatime)/1000;
            _this.Minute=Math.floor(_this.second/60);
            _this.houre=Math.floor(_this.Minute/60);
            _this.day=Math.floor(_this.houre/24);
            _this.houres=Math.floor(_this.houre%24);
            _this.Minutes=Math.floor(_this.Minute%60);
            _this.seconds=Math.floor(_this.second%60);
            _this.swite(json);
        },
        swite:function(json){//判断DOM显示内同
            if(json.oend==json.ostm){//只有结束倒计时需求
                if(_this.opatime<=0&&json.oindex.flag){
                    _this.setText(json.oindex,json.tend);//设置结束问题 下同
                    json.oindex.flag=0;
                    _this.clear(json.oindex.timer);//清楚倒计时 下同
                }else if(_this.opatime>0){
                     _this.nowtext(json.oindex,json.tlast); //显示倒计时时间 下同
                    json.oindex.flag=1;
                }
            }else if(json.oend!=json.ostm&&!json.ck){//有开始和结束需求 并且已经进入结束倒计时
                if(_this.opatime<=0&&json.oindex.flag){
                    _this.setText(json.oindex,json.tend);
                    json.oindex.flag=0;
                    _this.clear(json.oindex.timer);
                }else if(_this.opatime>0){
                    _this.nowtext(json.oindex,json.tlast);
                   json.oindex.flag=1;
                }
            }else if(json.oend!=json.ostm&&json.ck){//有开始和结束需求
                if(_this.opatime<=0){
                    _this.clear(json.oindex.timer);
                    _this.loop({oindex:json.oindex,
                                oend:json.oend,tend:json.tend,
                                tstat:json.tstat,
                                tlast:json.tlast,
                                ostm:json.ostm,
                                ck:false
                    });
                }else{
                    _this.nowtext(json.oindex,json.tstat);
                }
            }
        },
        setText:function(obj,txt){
            obj.innerText="";
            obj.innerText=txt;
        },
        nowtext:function(obj,str){
            obj.innerText=str+_this.day+"天"+_this.houres+"小时"+_this.Minutes+"分"+_this.seconds+"秒";
        },
        loop:function(json){
            _this.move(json);
            json.oindex.timer=setInterval(function(){_this.move(json)},1000);
        },
        clear:function(all){
            clearInterval(all);
        }
    }
    return tim;
})()
demo: http://w3cweb.sinaapp.com/7/demo.html
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值