我有一个for循环,它在有序列表中添加一个列表项和一堆其他信息。
它适用于第一个列表项,但其他列表项不填充/追加。
我很难找到我的代码的哪一部分导致了问题:
<script>
$(document).ready(function(){
var artistID =$(".artist").attr('id');
$.get("songs.php?id="+artistID, function(data){
for (var j=0; j < data.length; j++){
$(".songs."+data[j].ArtistNumber).append(
'<li class="song">'+
'<a class="song-link" onclick="songClick();return false;" href="'+data[j].FileLocation+'">'+
'<p>'+data[j].Title+'</p>'+
'<small>'+data[j].duration+'</small>'+
'</a>'+
'</li>'
);
}
},'json');
});
</script>
如有任何帮助,我们将不胜感激。
编辑:
事实证明,我只需要一个$(".artist").each(function(){})就可以了。
我希望这能对某人有所帮助。
经过多次评论,我终于明白你的意思了。下面是如何进行的:您想要一个嵌套的"each"循环。
由于您没有提供任何数据结构,我假设它看起来像这样:
data = {
"123" : [
{
"title" : "song 1",
"fileLocation" : "someURL",
"duration" : "2m45s"
},
{
"title" : "song 2",
"fileLocation" : "someOtherURL",
"duration" : "4m10s"
}
],
"456" : [
{
"title" : "song 1",
"fileLocation" : "someNewURL",
"duration" : "3m20s"
},
{
"title" : "song 2",
"fileLocation" : "someOtherNewURL",
"duration" : "4m17s"
}
]
}
我假设您的数据是一个包含键/值的对象,每个键都是艺术家编号,每个值都是该艺术家的歌曲列表(数组)(表示为带有详细信息的对象)。
以下是如何利用这些数据:
$.each(data, function(artistNumber, songs){ // Iterating through each artist/songs pair. songs is an array
$list = $(".songs." + artistNumber); // Select each list one by one in the dom
$.each(songs, function(index, song){ // song is an object
$list.append(
'<li class="song">'+
'<a class="song-link" onclick="songClick();return false;" href="'+song.fileLocation+'">'+
'<p>'+song.title+'</p>'+
'<small>'+song.duration+'</small>'+
'</a>'+
'</li>'
);
});
});
看看这把小提琴在演奏。
我不在乎你的DOM,我需要你的HTML,但这里有一个尝试:
<script>
$(document).ready(function(){
var artistID =$(".artist").attr('id');
$.get("songs.php?id="+artistID, function(data){
for (var j=0; j < data.length; j++){
$(".artist").append($("<ul />").addClass(data[j].ArtistNumber).addClass('songs'));
$(".songs."+data[j].ArtistNumber).html(
'<li class="song">'+
'<a class="song-link" onclick="songClick();return false;" href="'+data[j].FileLocation+'">'+
'<p>'+data[j].Title+'</p>'+
'<small>'+data[j].duration+'</small>'+
'</a>'+
'</li>'
);
}
},'json');
});
这仍然不会,因为你为类制作了选择器,并且这是用类艺术家获得的第一个项目,所以你需要更改选择器。试试这个每个