Javascript 为每个元素运行函数

我正在使用Peity js插件在我的页面上创建甜甜圈图表。我正在尝试为每个

.foo

元素设置图表动画：

<span class="foo" data-value="10"></span>

$('.foo').each(function () {

    var updateChart = $(this).peity('donut');
    var text = "";
    var i = 0;

    function myLoop() {
        setTimeout(function () {

            text = i + "/12";

            updateChart.text(text)
                .change()

            i = i + 0.2;

            var maxValue = $(this).data("value");
            if (i <= maxValue) myLoop();

        }, 0.5)
    }
    myLoop();
});

$（'.foo'）。每个（函数（）{
var updateChart=$（this.peity（'donut'）；
var text=“”；
var i=0；
函数myLoop（）{
setTimeout（函数（）{
text=i+“/12”；
updateChart.text（文本）
.change（）
i=i+0.2；
var maxValue=$（此）.data（“值”）；
如果（i当执行超时回调时，
此
上下文引用窗口，因为您实际上正在调用
窗口.setTimeout
方法

试试这个：

$('.foo').each(function () {

    var updateChart = $(this).peity('donut');
    var text = "";
    var i = 0;

    function myLoop() {
        setTimeout($.proxy(function () {
            text = i + "/12";
            updateChart.text(text)
                .change()
            i = i + 0.2;
            var maxValue = $(this).data("value");
            if (i <= maxValue) myLoop();
        },this), 0.5)
    }
    myLoop();
});

$（'.foo'）。每个（函数（）{
var updateChart=$（this.peity（'donut'）；
var text=“”；
var i=0；
函数myLoop（）{
setTimeout（$.proxy（函数）（）{
text=i+“/12”；
updateChart.text（文本）
.change（）
i=i+0.2；
var maxValue=$（此）.data（“值”）；
如果（i问题是计时器处理程序中的上下文，那么最简单的修复方法是使用闭包变量

$('.foo').each(function () {
    var $this = $(this);

    var updateChart = $this.peity('donut');
    var text = "";
    var i = 0;

    function myLoop() {
        setTimeout(function () {

            text = i + "/12";

            updateChart.text(text)
                .change()

            i = i + 0.2;

            var maxValue = $this.data("value");
            if (i <= maxValue) myLoop();

        }, 0.5)
    }
    myLoop();
});

$（'.foo'）。每个（函数（）{
var$this=$（this）；
var updateChart=$this.peity（'donut'）；
var text=“”；
var i=0；
函数myLoop（）{
setTimeout（函数（）{
text=i+“/12”；
updateChart.text（文本）
.change（）
i=i+0.2；
var maxValue=$this.data（“值”）；
if（我将该函数置于循环之外，并将$（this）的引用作为参数传递。此外，您的脚本应该在标记内部或js文件中，我在一些html下看到它，但我想您知道，对吗？
此
内部超时回调并不是指您认为它的元素is@ArunPJohny这一个实际工作！谢谢！嗨，它实际上是0.5为平滑动画，我得到了错误“myLoop未定义”。此解决方案实际上有效：此解决方案也有效，但实际上最好将
$（This）
的结果存储为变量。我使用代理来显示
This
上下文的问题谢谢您的帮助！