Javascript HTML5：启动计数器

我正在使用一个模板，其中有一个计数器css类，顾名思义，该类计数到给定的数量，并具有增量效果

这是密码

<div class="counter"><span id="emi" data-from="100" data-to="12835" data-refresh-interval="50" data-speed="5000">12835</span></div>

---

如果我删除

$（“#emi”）.html（emi）

它没有在html中更新任何内容，在

#emi

中仍然有一个以前的值。所以我正在努力

我不认为这个插件能让你重新启动自己，所以你需要侵入它。但这里有一个自制的演示，您可以根据自己的需要进行调整和改进。无论如何，它应该有助于理解如何制作插件

功能计数器（选择器）{
var self=这个；
//从元素获取所有道具
this.elem=document.querySelector（选择器）；
this.from=parseInt（this.elem.getAttribute（'data-from'）| | 100）；
this.to=parseInt（this.elem.getAttribute（'data-to'）| | 1000）；
this.refreshInterval=parseInt（this.elem.getAttribute（'data-refresh-interval'）| | 50）；
this.speed=parseInt（this.elem.getAttribute（'data-speed'）| | 5000）；
//启动计数器
//如果提供了重新启动（int）
//在超时完成后重新启动计数器
this.start=函数（重新启动）{
//基本逻辑，可以改进
var diff=自-自；
var步长=自速度/自刷新间隔；
var阶跃=差异/阶跃；
var i=1；
var interval=setInterval（函数（）{
var变化=步骤*i；
如果（更改为0）{
setTimeout（函数（）{
自启动（重启）；
}，重新启动）；
}
}
}自我更新间隔）；
}
}
//例1
var计数器=新计数器（“emi”）；
//2000毫秒后重新启动
计数器.启动（2000年）；
//例2
var计数器2=新计数器（“#emi2”）；
//不要重启
计数器2.启动（0）
您可以尝试使用jQuery
.animate（）
，
.data（）
，
.promise（）

注意，
数据刷新间隔=“50”
的预期影响不确定


$.fx.interval=0；
var el=$（“emi”）；
功能计数器（elem）{
返回$({
from:elem.data（）.from
}).制作动画({
from:elem.data（）.到
}, {
放松：“线性”，
持续时间：elem.data（）.速度，
步骤：函数（现在，fx）{
元素
.text（数学地板（现在））
}
}).promise（）.then（函数（））{
返回元素
})
}
计数器（el）.然后（函数（_elem）{
//“元素”：这个`
//重新启动'counter'，并在'elem'：'u elem'：'this处设置新选项`
计数器（此.data（{from:100，to:10000，刷新间隔：100，速度：5000}）；
})
大多数计数器的工作方式是，它们在页面加载时启动，在达到给定数字时停止，在您的例子中是12835。你能不能具体说明一下你想用一个计数器来实现什么？什么是无休止的运行？
上的所有计数器都有一个指定的终点，直到它是倒计时计数器，但它们也有一个终点。

如果您可以在CSS中提供
class=“counter”
的规范，它可能有助于找到解决问题的方法。但是，实现这些功能的最初原因是什么？

如果你想让你的网站访问者注意到这一点，那么也许你可以让计数器运行得慢一点或者放大初始数字

您提供的代码不是MVP
 你能在问题中包括文档吗？号码应该改成什么？计数器的预期结果是否被调用两次？“所以，当我加载页面时，这就起作用了。它的计数从100到12835，具有反作用”你能创建stacksnippets来演示吗？只需使用javascript并将数据修改为属性…？是的，没有文档吗？？还是示例代码？@LukePark是的，但它只改变一个数字，没有反作用。@guest271314我发布了一个链接。在我购买时得到的文档中，他们只说明了来自

的

数据、
数据到
和其他属性，但没有起止点。信息非常有限。我对html5知之甚少，可以用html5处理吗？还是js库？我尝试了所有的方法，但仍然不起作用。你的代码对我来说有点难，正在努力。同时，我正在编辑这个问题，以添加更多关于我正在做什么的细节。我有一个计算器，你们一开始输入它就会计算EMI。因此，如果输入P、R和N，它将计算EMI。这里我需要效果。现在，当你改变N，R，P值中的任何一个时，我想增加/减少EMI值，与之前的值相比，效果更好。问题是，当我通过jquery动态放置计数器时，它并没有按预期运行。看起来不像计数器，只是一个简单的数字。
// assume
var emi = 10000;

$("#emi").hide();
$("#emi").html(emi);
$("#emi").removeAttr("class");


$("#emi").parent().attr("class", "counter");
$("#emi").attr("data-from", "100");
$("#emi").attr("data-to", emi);
$("#emi").attr("data-refresh-interval", "50");
$("#emi").attr("data-speed", "5000");
$("#emi").show();