自动递增 JS 对象数组答案

【问题标题】：Auto Incrementing JS Object Array自动递增 JS 对象数组
【发布时间】：2016-02-19 20:50:27
【问题描述】：

我有点难过，可能忽略了一些东西。基本上我有一个 JS 对象数组：

var defaults = {
    pointers : {
        pointer1 : {
            top : '0px',
            left : '75px',
        },
        pointer2 : {
            top : '310px',
            left : '170px',
        },
        pointer3 : {
            top : '50px',
            left : '80px'
        },
        pointer4 : {
            top : '0px',
            left : '130px',
        },
        pointer5 : {
            top : '310px',
            left : '205px',
        },
        pointer6 : {
            top : '50px',
            left : '90px'
        }
    }
};

如果我手动调用它们以添加到具有 pointer-circle 类的 <li> 它工作正常：

$('.pointer-circle:eq(1)').css({
    top : defaults.pointers.pointer1.top,
    left : defaults.pointers.pointer1.left
});

但不是手动输出每个指针，而是希望它们通过 for 循环：

var i = 1;
for (i in defaults.pointers) {
    $('.pointer-circle:eq(' + i + ')').css({
        top : defaults.pointers.pointer[i].top,
        left : defaults.pointers.pointer[i].left
    });
}

这不起作用。在控制台日志中，我收到此错误：

未捕获的类型错误：无法读取未定义的属性“pointer1”

非常感谢任何帮助。

【问题讨论】：

谢谢。当我盯着同一个代码太久时，就会发生这种情况。不知道为什么我被否决了。只是寻求帮助...

标签： javascript jquery arrays javascript-objects

【解决方案1】：

这就是你想要的：

var counter = 0;
for (i in defaults.pointers) {
    $('.pointer-circle:eq(' + counter + ')').css({
        top : defaults.pointers[i].top,
        left : defaults.pointers[i].left
    });
    counter++;
}

（另见this Fiddle）

【讨论】：

老实说，我重写了几次，所以最初它是<li> 的编号，使用$('.pointer-circle').length 和常规for 循环。所以现在它最终不是我想要的。
@PlatinumJay ：我刚刚更新了我的代码并发布了一个指向工作小提琴的链接。
@JohnSlegers 谢谢，现在说得通了。我在整个代码中改变了主意，最终把自己搞混了。

【解决方案2】：

i 直接引用对象。你只想要i.top。您将标准 for 循环与 for-in 循环混为一谈。当然，这意味着$('.pointer-circle:eq(' + i + ')')不是你想的那样。

【讨论】：