jquery中的.each（）方法

我需要将数据添加到一组图像中，这些图像在每个元素之后递增。 Jquery in Action有这样的代码：

settings.thumbnails$ = this.filter('img'); settings.thumbnail$.each(function(n) { $(this).data('photo-index',n); 

该书说，使用.each（）会为每个记录其在列表中的位置的元素添加一个唯一的数字。 我不明白这是怎么回事，因为附加到’photo-index’的值n对于每次迭代都是相同的…

有谁看到我在这里失踪了？

Answer 1

 var data = ['foo','bar','foobar','baf','woot']; $.each(data,function(iterator,element){ console.log(iterator+'. '+element); }); 

你错过了.each在函数调用中有两个参数。

因此，要将其应用于您的代码：

 settings.thumbnails$ = this.filter('img'); settings.thumbnails$.each(function(i,e) { // add back the iterator (i) $(this).data('photo-index',i); // reference it here }); 

您还可以在.each调用中引用“settings.thumbnail $”（单数），这可能是问题所在，但我不知道您的目的是什么。

或者，您可以使用.each()并使用它的本机索引来分配：

 settings.thumbnails$.each(function(i,e){ $(this).data('photo-index',$(this).index()); }); 

Answer 2

jQuery each（）将使用列表中当前迭代的索引填充第一个参数，因此settings.thumbnail $的每个元素将被分配一个唯一的n到$(this).data('photo-index', n)

Answer 3

在函数内部， this关键字指的是您正在迭代的单个元素。 n将是索引。 因此，如果你有3个img元素，函数将被调用3次， n从0到2，每个当前元素都绑定this 。 您还可以通过函数的第二个参数访问元素： function(n, element) { $(element).data("photo-index", n); } function(n, element) { $(element).data("photo-index", n); }

文档在这里 。

Answer 4

filter函数返回带有图像元素的数组。 唯一的数字可能确实是指数组索引。 因此， n是调用filter结果中图像的索引。

只要您在文档中当前显示的图像之后添加图像，此索引就会保持不变。