jQuery計時器外掛程式

標籤：style   blog   io   ar   color   os   sp   for   on   

/** * 定義一個jQuery計時外掛程式，實現記錄計時開始時間、結束時間，總共耗時的功能 * @param $ *  * @author Ivan [email protected] * @date 2014年11月25日 下午8:48:55  * @version V1.0 *  */(function($){        $.timer = {};        /**     * 擴充Date對象，為其增加一個格式化方法     * @param format 傳入日期格式，如yyyy-MM-dd hh:mm:ss     * @returns     */    Date.prototype.format = function(format) {        var o = {            "M+" : this.getMonth() + 1, // month            "d+" : this.getDate(), // day            "h+" : this.getHours(), // hour            "m+" : this.getMinutes(), // minute            "s+" : this.getSeconds(), // second            "q+" : Math.floor((this.getMonth() + 3) / 3), // quarter            "S" : this.getMilliseconds()        // millisecond        };        if (/(y+)/.test(format))            format = format.replace(RegExp.$1, (this.getFullYear() + "")                    .substr(4 - RegExp.$1.length));        for ( var k in o)            if (new RegExp("(" + k + ")").test(format))                format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k]                        : ("00" + o[k]).substr(("" + o[k]).length));        return format;    };        var interval = 0; // 定義一個定時器        // 私人函數：啟動計時器函數    function run(et) {        interval = setInterval(chat, "1000",et); // 定時的設定    }        // 私人函數：定時執行函數    function chat(et) {        var d = new Date().format(‘yyyy-MM-dd hh:mm:ss‘);        //更新結束時間        $("#"+et).html(d);    }        // 外掛程式的defaults    $.timer.defaults = {        startTime : ‘startTime‘,        endTime : ‘endTime‘,        costTime : ‘costTime‘    };        //計時開始    $.timer.start = function(options){        var opts = $.extend({}, $.timer.defaults, options);                var st = new Date().format(‘yyyy-MM-dd hh:mm:ss‘);        $("#"+opts.startTime).html(st);        $("#"+opts.costTime).html("");                chat(opts.endTime);        // 載入頁面時啟動定時器        run(opts.endTime);     };        //私人函數：計算統計耗時    function setCostTime(opts) {        var sTime = $("#"+opts.startTime).html();        var eTime = $("#"+opts.endTime).html();        var sDate = new Date(Date.parse(sTime.replace(/-/g, "/")));        var eDate = new Date(Date.parse(eTime.replace(/-/g, "/")));        var diffMillisecond = eDate.getTime() - sDate.getTime(); // 時間差的毫秒數        // 計算出相差天數        var days = Math.floor(diffMillisecond / (24 * 3600 * 1000));        // 計算出小時數        var leave1 = diffMillisecond % (24 * 3600 * 1000); // 計算天數後剩餘的毫秒數        var hours = Math.floor(leave1 / (3600 * 1000));        // 計算相差分鐘數        var leave2 = leave1 % (3600 * 1000); // 計算時數後剩餘的毫秒數        var minutes = Math.floor(leave2 / (60 * 1000));        // 計算相差秒數        var leave3 = leave2 % (60 * 1000); // 計算分鐘數後剩餘的毫秒數        var seconds = Math.round(leave3 / 1000);        var ctText = "耗時： " + days + "天 " + hours + "小時 " + minutes + " 分鐘" + seconds + " 秒";                $("#"+opts.costTime).html(ctText);    }        //計時結束    $.timer.stop = function(options){                var opts = $.extend({}, $.timer.defaults, options);                // 關閉定時器        clearTimeout(interval);                 setCostTime(opts);            };    })(jQuery);

jQuery計時器外掛程式