Jquery $。每个循环处理数组

我正在jquery中的一个对象内部的一个URL数组，我正处于超级接近完成的地步，但是我遇到了一个小问题。

我已经将下面的循环绑定到点击功能，当用户点击一张照片（在[位置]）一堆相应的照片应该加载下面，这些照片存储在一个数组中，我可以成功访问该数组位于正确的对象内部，但不是按顺序插入URLS，而是将每个URL插入到由照片分隔的每张照片中。

即代替：img src="[0]"，img src="[1]"，img src="[2]" ......

我呈现：img src="[0],[1],[2]" ...

$.each(albums[location].photos, function(index, val){ 
    $('#'+cover_id+'').append('<div id="'+cover_id+'" class="thumbnail" style="display:inline-block; padding: 0 25px;"><img src='+albums[location].photos+' id="coverPhoto" height="320" width="320"><figcaption>'+location+'</figcaption></a></div>'); 
});

我想我可以用另一个循环解决这个问题，但由于使用$ .each而显得笨重。

任何帮助，将不胜感激

来源

2016-10-22 JQBolo

你必须使用的参数。每个$

你有2种方式，使用索引或价值

$.each(albums[location].photos, function(index, val){ $('#'+cover_id+'').append('<div id="'+cover_id+'" class="thumbnail" 
style="display:inline-block; padding: 0 25px;"><img 
src='+albums[location].photos[index]+' id="coverPhoto" height="320" 
width="320"><figcaption>'+location+'</figcaption></a></div>'); });

或

$.each(albums[location].photos, function(index, val){ $('#'+cover_id+'').append('<div id="'+cover_id+'" class="thumbnail" 
style="display:inline-block; padding: 0 25px;"><img 
src='+val+' id="coverPhoto" height="320" 
width="320"><figcaption>'+location+'</figcaption></a></div>'); });

来源

2016-10-22 13:12:41 ainasiart

这正是我一直想念的！我一直在试图绕过对象遍历和每个循环，这是关键！非常感谢:) – JQBolo

但给了解决方案之后，我给你正确的方式来调试它。打开Chrome开发者工具或者浏览器的任何开发工具（我为此工作做了优先选择），然后将它放在$ .each的“内部”行中，您可以看到所有传递的值，哪里出错。也许你必须把你的代码分成几行来阅读 – ainasiart

我相信你会想<img src='+val+'...

更换<img src='+albums[location].photos+'...我还想补充一点，它看起来像你重用你重复的元素，这几乎是肯定的ID例如，如果您想要在相同页面中替换两次图片，请创建问题。它也违反了HTML规范。

来源

2016-10-22 13:11:53

前置主容器和一次当你即将完成循环时关闭它，这里更清晰的代码

$.each(albums[location].photos, function(index, val){ 
    if (index == 0) { 
     $('#'+cover_id+'').append('<div id="'+cover_id+'" class="thumbnail" style="display:inline-block; padding: 0 25px;">'); 
    } 

    $('#'+cover_id+'').append('<img src='+albums[location].photos[index]+' id="coverPhoto" height="320" width="320">'); 

    if (albums[location].photos.length >= (index - 1)) {   
     $('#'+cover_id+'').append('<figcaption>'+location+'</figcaption></a></div>'); 
    } 
});

来源

2016-10-22 13:15:01 Jazzzzz

问题：您将整个数组本身分配为索引的源而不是特定索引。 <img src='+albums[location].photos+'

解决方案：使用回调函数返回的val变量。 val指向索引处的特定项目，并在每次迭代时指向下一个项目。

<img src='+val+'

来源

2016-10-22 13:19:12

Jquery $。每个循环处理数组

回答

相关问题