zoukankan      html  css  js  c++  java
  • jQuery计时器插件

    /**
     * 定义一个jQuery计时插件,实现记录计时开始时间、结束时间,总共耗时的功能
     * @param $
     * 
     * @author Ivan 2862099249@qq.com
     * @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);
  • 相关阅读:
    还在使用golang 的map 做Json编码么?
    Golang 性能测试(2) 性能分析
    golang 性能测试 (1) 基准性能测试
    消息队列 NSQ 源码学习笔记 (五)
    消息队列 NSQ 源码学习笔记 (四)
    消息队列 NSQ 源码学习笔记 (三)
    消息队列 NSQ 源码学习笔记 (二)
    消息队列 NSQ 源码学习笔记 (一)
    你不知道的空格
    Supervisor 使用和进阶4 (Event 的使用)
  • 原文地址:https://www.cnblogs.com/ivan0626/p/4161543.html
Copyright © 2011-2022 走看看