国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

javascript實現的簡單計時器

2019-11-20 12:01:23
字體:
來源:轉載
供稿:網友

最近寫了很多微信端的互動小游戲,比如下雪花 限時點擊 贏取獎品,限時拼圖,限時答題等,都是些限時‘游戲'(其實算不上游戲,頂多算是具有一點娛樂性的小互動而已)

上面出現了4個限時,對,沒錯,這里記錄的就是最近寫的 ‘計時器' ...

恩 , 計時器 就一個setInterval 或 setTimeout 即可實現 ,代碼不會超過十行!

但是不防抱著沒事找事的心態,來寫個能復用的計時器

1.能倒計時 也能順計時

2.復位、暫停、停止,啟動功能

//計時器window.timer = (function(){  function mod(opt){    //可配置參數 都帶有默認值    //必選參數    this.ele = typeof(opt.ele)=='string'?document.getElementById(opt.ele):opt.ele;//元素    //可選參數    this.startT = opt.startT||0;//時間基數    this.endT = opt.endT=='undefined'?24*60*60:opt.endT;//結束時間 默認為一天    this.setStr = opt.setStr||null;//字符串拼接    this.countdown = opt.countdown||false;//倒計時    this.step = opt.step||1000;    //不可配置參數    this.timeV = this.startT;//當前時間    this.startB = false;//是否啟動了計時    this.pauseB = false;//是否暫停    this.init();  }  mod.prototype = {    constructor : 'timer',    init : function(){      this.ele.innerHTML = this.setStr(this.timeV);    },    start : function(){      if(this.pauseB==true||this.startB == true){        this.pauseB = false;        return;      }      if(this.countdown==false&&this.endT<=this.cardinalNum){        return false;      }else if(this.countdown==true&&this.endT>=this.startT){        return false;      }      this.startB = true;      var v = this.startT,        this_ = this,        anim = null;      anim = setInterval(function(){        if(this_.startB==false||v==this_.endT){clearInterval(anim);return false}        if(this_.pauseB==true)return;        this_.timeV = this_.countdown?--v:++v;        this_.ele.innerHTML = this_.setStr(this_.timeV);      },this_.step);    },    reset : function(){      this.startB = false;      this.timeV = this.startT;      this.ele.innerHTML = this.setStr(this.timeV);    },    pause : function(){      if(this.startB == true)this.pauseB = true;    },    stop : function(){      this.startB = false;    }  }  return mod;})(); 

調用方式:

var timerO_1 = new timer({      ele : 'BOX1',      startT : 0,      endT : 15,      setStr : function(num){        return num+'s';      }    });var timerO_2 = new timer({      ele : 'BOX2',      startT : 30,      endT : 0,      countdown : true,      step : 500,      setStr : function(num){        return num+'s';      }    });

這里傳入的方法 setStr是計數器計算的當前時間寫入ele前的字符串處理

countdown是否為倒計時 默認為順計時

可以通過 timerO.timeV 來獲取當前時間

以上所述就是本文的全部內容了,希望大家能夠喜歡。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 临洮县| 弋阳县| 旬邑县| 泰顺县| 织金县| 许昌市| 邓州市| 洞头县| 宾川县| 鹿邑县| 中江县| 西平县| 呼图壁县| 乃东县| 沙湾县| 武清区| 吉林市| 保康县| 耒阳市| 中牟县| 通榆县| 商水县| 高尔夫| 汝南县| 华亭县| 河南省| 贵阳市| 轮台县| 灵石县| 万盛区| 阳泉市| 临西县| 吴堡县| 巴林右旗| 灵璧县| 洮南市| 新化县| 贵定县| 旌德县| 论坛| 嘉定区|