https://transmundial.org/tpl/TWR/lib/numscroll/jquery.numscroll.js?1790341883

1/*!
2 * jquery.numscroll.js -- 数字滚动累加动画插件  (Digital rolling cumulative animation)
3 * version 3.0.0
4 * 2019-08-08
5 * author: KevinTseng < [email protected]@qq.com >
6 * API文档: https://github.com/chaorenzeng/jquery.numscroll.js.git
7 * 交流Q群: 814798690
8 */
9
10(function($) {
11
12    $.fn.numScroll = function(options) {
13        var settings = $.extend({
14            'number': '0', //数值
15            'step': 1, //步长
16            'time': 2000, //限制用时(为0时不限制) Limited use time (0 time is not limited)
17            'delay': 0, //延迟开始(ms) delay(ms)
18            'symbol': false ,//是否显示分隔符 display separators
19            'fromZero': true, //是否从0开始计数（为否时从原有值开始计数） Whether to start counting from zero(If not, count from the original value)
20        }, options);
21        settings.number = settings.number.toString(); //数值转字符串
22
23        return this.each(function(){
24            //初始化配置
25            var $this = $(this),
26                oldNum = $this.text() || '0';
27            //分隔符显示判断
28            if (settings.number.indexOf(',') > 0) {
29                //数值含有分隔符，则默认为需要显示分隔符
30                settings.symbol = true;
31            }
32            if (options && options.symbol===false) {
33                //手动设置不显示分隔符时，不显示分隔符
34                settings.symbol = false;
35            }
36            //显示初始值
37            var targetNum = settings.number.replace(/,/g, '') || 0,
38                oldRealNum = oldNum.replace(/,/g, '');
39            if(settings.symbol){
40                $this.text(oldNum);
41            }else{
42                $this.text(oldRealNum);
43            }
44            //判断从0开始计数或从原有值开始计数
45            if (settings.fromZero) {
46                oldRealNum = 0;
47            }
48            //非数值处理
49            if(isNaN(oldRealNum)){
50                oldRealNum = 0;
51            }
52            if(isNaN(targetNum)){
53                return;
54            }
55            //初始值目标值准备
56            targetNum = parseFloat(targetNum);
57            oldRealNum= parseFloat(oldRealNum);
58            var tempNum = oldRealNum,
59                numIsInt = isInt(targetNum),
60                numIsFloat = isFloat(targetNum),
61                step = !settings.time?1:Math.abs(targetNum-oldRealNum) * 10 / settings.time,
62                numScroll;
63            //更新方法
64            function numInitUpdate() {
65                var showNum = '';
66                //整型或浮点型
67                if (numIsInt) {
68                    showNum = Math.floor(tempNum);
69                } else if (numIsFloat != -1) {
70                    showNum = tempNum.toFixed(numIsFloat)
71                } else {
72                    showTarget(targetNum);
73                    clearInterval(numScroll);
74                    return;
75                }
76                //千位符显示
77                if (settings.symbol) {
78                    showNum = formatSymbol(showNum);
79                }
80                $this.text(showNum);
81            }
82
83            //最终显示
84            function showTarget(num) {
85                var targetNum = num.toString().replace(/,/g, '');
86                if (settings.symbol) {
87                    targetNum = formatSymbol(targetNum);
88                }
89                $this.text(targetNum);
90            }
91
92            //定时开始
93            setTimeout(function() {
94                numScroll = setInterval(function() {
95                    numInitUpdate();
96                    if(oldRealNum < targetNum){
97                        //增
98                        tempNum += step;
99                        if (tempNum > targetNum) {
100                            showTarget(targetNum);
101                            clearInterval(numScroll);
102                        }
103                    }else{
104                        //减
105                        tempNum -= step;
106                        if (tempNum < targetNum) {
107                            showTarget(targetNum);
108                            clearInterval(numScroll);
109                        }
110                    }
111                }, 1);
112            }, settings.delay);
113
114        })
115    };
116
117    /*	

118     * 判断数值是否为整数
119     * @param num {Number} 数值
120     * @return {Boolean} 真假
121     */
122    function isInt(num) {
123        var res = false;
124        try {
125            if (String(num).indexOf(".") == -1 && String(num).indexOf(",") == -1) {
126                res = parseInt(num) % 1 === 0 ? true : false;
127            }
128        } catch (e) {
129            res = false;
130        }
131        return res;
132    }
133
134    /*	
135     * 判断数值是否为小数
136     * @param num {Number} 数值
137     * @return {Number} 小数位数(-1时不是小数)
138     */
139    function isFloat(num) {
140        var res = -1;
141        try {
142            if (String(num).indexOf(".") != -1) {
143                var index = String(num).indexOf(".") + 1; //获取小数点的位置
144                var count = String(num).length - index; //获取小数点后的个数
145                if (index > 0) {
146                    res = count;
147                }
148            }
149        } catch (e) {
150            res = -1;
151        }
152        return res;
153    }
154
155    /*	
156     * 显示数值千分位分隔符
157     * @param num {Number} 数值
158     * @return {String} 含分隔符数值
159     */
160    function formatSymbol(num) {
161        var res = '';
162        var str = num + '',
163            strLeft = '',
164            strRight = '';
165        var floatNum = isFloat(num);
166        if (floatNum != -1) {
167            //有小数时进行切割
168            var splitStr = str.split('.');
169            strLeft = splitStr[0];
170            strRight = splitStr[1];
171        } else {
172            strLeft = str;
173        }
174        //整数部分每隔3位添加分隔符
175        res = strLeft.split("").reverse().reduce(function(prev, next, index) {
176            return ((index % 3) ? next : (next + ',')) + prev;
177        })
178        //拼接小数部分
179        if (strRight != '') {
180            res = res + '.' + strRight;
181        }
182        return res;
183    }
184})(jQuery);