0

我有一个关于数组值的问题。我想要以下代码：

cubes[0].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*5, 'background-color': '#1f2c8a'}, Math.floor(Math.random()*1800));
cubes[1].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*4, 'background-color': '#3d809a'}, Math.floor(Math.random()*1800));
cubes[2].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*3, 'background-color': '#1f2c8a'}, Math.floor(Math.random()*1800));
cubes[3].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*2, 'background-color': '#510000'}, Math.floor(Math.random()*1800));
// until ...
cubes[300].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*4, 'background-color': '#3d809a'}, Math.floor(Math.random()*1800));

我想要做的是将整数剪掉并i在 for 循环中填充它。

就像是：

  for (var i = 0; i < 300; i++) {
cubes[i].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*5, 'background-color': '#1f2c8a'}, Math.floor(Math.random()*1800));
cubes[i].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*4, 'background-color': '#3d809a'}, Math.floor(Math.random()*1800));
cubes[i].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*3, 'background-color': '#1f2c8a'}, Math.floor(Math.random()*1800));
cubes[i].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*2, 'background-color': '#510000'}, Math.floor(Math.random()*1800));
// until ...
cubes[i].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*4, 'background-color': '#3d809a'}, Math.floor(Math.random()*1800)); 
}

这是因为我不想在 300 之前输入每个数字。应该有一个类似函数的东西，它可以找到方括号并用数字填充它。困难的是，每个立方体的动画属性都不同。（但我已经有了）

谢谢

4

3 回答 3

1

引入一个索引变量i并在每次数组访问时递增它，如下所示：

var i = 0;
cubes[i++].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*5, 'background-color': '#1f2c8a'}, Math.floor(Math.random()*1800));
cubes[i++].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*4, 'background-color': '#3d809a'}, Math.floor(Math.random()*1800));
cubes[i++].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*3, 'background-color': '#1f2c8a'}, Math.floor(Math.random()*1800));
cubes[i++].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*2, 'background-color': '#510000'}, Math.floor(Math.random()*1800));
// until ...
cubes[i++].animate({ top: fixedOffs.top+row*20, left: fixedOffs.left-row*4, 'background-color': '#3d809a'}, Math.floor(Math.random()*1800));

使用支持正则表达式的文本编辑器，您可以i++通过搜索cubes\[\d+\]并将现有的硬编码索引替换为cubes[i++].

于 2013-10-31T13:17:02.827 回答
1

将变量属性保存在某处：

var props = [
  { left : 5, bgColor: '#123' },
  { left : 4, bgColor: '#456' },
  { left : 2, bgColor: '#fff' },
  ...
  { left : 3, bgColor: '#f00' } 
];

然后使用循环：

for (var i = 0; i < cubes.length; i++) {
  cubes[i].animate(
    { 
      top: fixedOffs.top+row*20,
      left: fixedOffs.left-row * props[i].left,
      'background-color': props[i].bgColor
    },
    Math.floor(Math.random()*1800)
  );
}
于 2013-10-31T12:04:57.090 回答
0

利用.eq()

.get()并[]返回本机 dom 元素，而不是 jQuery 集合。

如果你要为 300 件东西制作动画，我建议你放弃 jQuery。

于 2013-10-31T12:02:08.237 回答