Question

我有一些分配给div id的变量，我想循环遍历它们。目前我无法将正确的值传递给变量：

var video0, video1, video2;
video0 = '#div0';
video1 = '#div1';
video2 = '#div2';

for (i = 0; i <= 3; i ++) {
  $(video+i).click(function(){
      setupVideo(i);
  });
}

// Play each of the videos.
function setupVideo(index) {
  videoCount = index;
  playVideos(videoCount);
}

我知道我的问题在于

$(video+i).click(function(){...

我尝试过将i传递给视频变量的各种方法。

Answer 1

你的方法在很多层面都是错误的。

首先，你不能添加＆＃34;一个变量的数字，并期望创建另一个变量。当您执行＆＃34; video + i＆＃34;时，您要将变量video的内容添加到变量{{1}的内容中}}。您有没有变量名为i，因此您要将video添加到数字中。

您需要做的是动态访问变量，在Javascript中，您可以通过访问变量所在范围内的对象来实现，例如undefined。

然后，您必须将window视为关联数组，因此使用window访问video0，video1 ...... 请注意window["video" + i]周围的引号：这意味着您连接两个字符串（＆＃34;视频＆＃34;以及i的内容，这是一个数字但是转换为字符串），从而创建像＆＃34; video0＆＃34;，＆＃34; video1＆＃34;等字符串，并将这些新创建的字符串用作键一个关联数组，用于获取值。

这是可能的，因为Javascript在主范围内创建了这样的数组。

然后再次，方法并不好。您应该使用数组来执行以下操作：

"video"

或使用通用课程来识别您的视频

Answer 2

您无法通过将其名称连接在一起来访问变量。更好的方法是在所有元素上放置一个公共类，并将它们的索引传递给playVideos()。试试这个：

$('.video').click(function() {
    playVideos($(this).index('.video'));
});

Answer 3

对于您的代码解决方案，使用window

访问全局变量

var video0, video1, video2;
video0 = '#div0';
video1 = '#div1';
video2 = '#div2';

for (i = 0; i <= 3; i ++) {
  $(window['video'+i]).click(function(){
      setupVideo(i);
  });
}

// Play each of the videos.
function setupVideo(index) {
  videoCount = index;
  playVideos(videoCount);
}

我建议在数组中使用store each元素选择器，而不需要setupVideo()函数。

var video_elements=["#div0","#div1","#div2"];
for (i = 0; i <= video_elements.length; i ++) {
  $(video_elements[i]).click(function(){
      playVideos(i);
  });
}

Answer 4

尝试在循环上创建选择器并使用方法on添加事件处理程序。在元素上添加数据值并使用它来读取以执行setupVideo方法。请参阅以下代码的评论：

for (i = 0; i < 2; i ++) {
  var divElement = $("#div" + i);
  divElement.data("index", i);
  divElement.on("click", function() {
      var index = $(this).data("index");
      setupVideo(index);
  });
}

对变量进行简单的单击事件

4 个答案: