循环遍历数组Javascript [重复]答案

【问题标题】：Cycle through an array Javascript [duplicate]循环遍历数组Javascript [重复]
【发布时间】：2015-12-07 12:11:29
【问题描述】：

我的数组var myImages = [];，一旦我拥有console.log() 数组（我将项目推入上面），我就会得到这个：

["01_img"]
["02_img"]
["03_img"]
["04_img"]
["05_img"]

然后onClick 我将div 的背景更改为具有来自数组的背景图像。

$('.div_content').css('background-image', 'url(https://url/path/images/' + myImages + '.png)');

我怎么改make呢，所以背景图我改了onClick。

我按照我找到的示例进行了尝试，但没有成功：

    $('.btn').on('click', function(){
      var myIndex = 1;
          myIndex = (myIndex+1)%(myImages.length);

          $('.div_content').css('background-image', 'url(https://url/path/images/' + myIndex + '.png)');)
    });

感谢您的帮助。

【问题讨论】：

问题不清楚。能详细点吗？
对不起，我的错。基本上，数组中的每个项目都是一个图像名称。所以onClick 我用数组中的项目更改了div 的背景图像。我遇到的问题是它总是加载到第一个数组项中。我需要onClick从数组中随机选择一个项目

标签： javascript jquery

【解决方案1】：

如果我正确理解您的问题，您应该只在全局或外部范围内定义您的 myIndex 变量

var myIndex = 0;
$('.btn').on('click', function(){
    $('.div_content').css('background-image', 'url(https://url/path/images/' + myImages[myIndex] + '.png)');
    myIndex = (myIndex+1)%(myImages.length);
});

【讨论】：

...但不是 global，只是点击处理程序关闭的东西。应避免使用全局变量。
谢谢，我刚刚编辑了

【解决方案2】：

每次单击时，myIndex 变量设置为 1。删除行 var myIndex = 1; 并将 myIndex 设为全局变量。

您还需要使用myImages[myIndex] 而不是myIndex，这将从myIndex 获取该值作为来自myImages 的键

var myIndex = 0;

$('.btn').on('click', function(){
   myIndex = (myIndex+1)%(myImages.length);
   $('.div_content').css('background-image', 'url(https://url/path/images/' + myImages[myIndex] + '.png)');)
});

【讨论】：

还需要开始一个0，并在之后使用该值递增。

【解决方案3】：

var myIndex = 0;
$('.btn').on('click', function(){
      // Short hand if: If the statement is true, use the first value, else (':') the second.
      myIndex = (myIndex+1)%(myImages.length);
      $('.div_content').css('background-image', 'url(https://url/path/images/' + myImages[myIndex] + '.png)');)
});

您应该通过声明一个将您的位置存储在数组中的全局变量来做到这一点：myIndex，然后递增该数字并确保它不超过数组长度（减 1，因为数组长度从 0 开始）。

如果您想从数组中随机选择，请尝试以下操作：

myIndex = Math.floor(Math.random() * myImages.length);

然后您可以使用myImages[myIndex] 简单地请求该位置的值。

【讨论】：

@T.J.Crowder 是的，我从来没有那样做。让我恢复一下。
真的很酷。 :-) 说length 是5。如果您以i = 0 开头，那么i = (i + 1) % length、i 将变为0、1、2、3、4、0、1、2、3、4...
@T.J.Crowder 酷 - 如果有点难以阅读（但这可能是因为我还没有使用它。虽然这可能是很好的画廊材料）。干杯