javascript - 自动递增 JS 对象数组

Question

我有点难过，可能忽略了一些东西。基本上我有一个 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'
        }
    }
};

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

$('.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
    });
}

这是行不通的。在控制台日志中，我收到此错误:

Uncaught TypeError: Cannot read property 'pointer1' of undefined

非常感谢任何帮助。

Answer 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)