countUp.min.js实现数字增量滚动效果，并用轮询的方式实现大数据实时动态更新。

网上找的效果图、实现类似这种滚动效果、实时刷新累计增加。

实现：

1、首先引用JS，再加上基本JQuery；

<script src="~/js/countUp.min.js"></script>
<script src="~/js/jquery.min.js"></script>

2、HTML代码；

 <h2 id="BigUpdataValue"></h2>

3、JS代码，首先先声明基本项

  var options = {
            useEasing: true, 	    // 使用缓和
            useGrouping: true,      // 使用分组(是否显示千位分隔符,一般为 true)
            separator: ',',         // 分隔器(千位分隔符,默认为',')
            decimal: '.'            // 十进制(小数点符号,默认为 '.')
            prefix: '',	            // 字首(数字的前缀,根据需要可设为 $,¥,￥ 等)
            suffix: ''              // 后缀(数字的后缀 ,根据需要可设为 元,个,美元 等)
        };

4、具体实现调用一句话即可。

new CountUp('BigUpdataValue', 0, 10000, 2, 1, options).start();
//target = 目标元素的 ID；
//startVal = 开始值；
//endVal = 结束值；
//decimals = 小数位数，默认值是0；
//duration = 动画延迟秒数，默认值是2；
//options  即为上一步声明的

至此，上述代码 即可实现文章顶部，数字实时滚动效果。startVal，endVal ，设置即为动态滚动效果。

如需实现实时动态刷新效果，可以点击查看 轮询实现。

为了方便这里写上简易版本，都为js简易版本。下述longPolling方法，任意都可以。

        window.onload = function () {
            //延迟5秒开始执行
            setTimeout(longPolling, 5000);
        }

        //function longPolling() {
            // $.getJSON("@Url.Content("")", function (json) {
            //   if (json.data != "" && json.data != null) {
            //     
            //    }
            //    else
            //       setTimeout(longPolling, 100);
            //});
         function longPolling() {
            $.ajax({
                url: "",
                data: { },
                type: "get",
                dataType: "json",
                async: true,
                success: function (data) {
                    if (data.state == "success") {
                        //获取数据集
                        setTimeout(longPolling, 1000);

                    } else {
                        alert(data.message);
                    }
                }
            });
        };

 

以上。欢迎讨论。