JSON复制对象
问题描述:
我从一个json获取数据,我希望显示为按钮的文本,但是,我得到的是相互重叠的按钮。我做了什么,似乎无法解决它。这是函数:JSON复制对象
function initPlaylist() {
//Get the playlists data from JSON
$.get('json/playlists.json', function(data) {
data.forEach(function(playlist) {
//Create div for each playlist and populate it
var album = $('<div>', {class: 'pl-singular-playlist'}).appendTo(playlistsContainer);
//Playlist image
$('<img>', {src: playlist.image}).appendTo(album);
//Playlist button
$('<button>', {
'data-id': playlist.id,
text: playlist.name,
class: 'pl-play-button',
click: function (e) {
//Show image in music player
$('<img>', {
src: playlist.image,
id: 'pl-selected-image'
}).appendTo(playerContainer);
//Set background image for the music player container
$(mainContainer).css('background-image', 'url(' + playlist.image + ')');
$(mainContainer).css('background-size', 'cover');
$(mainContainer).css('background-repeat', 'no-repeat');
$(mainContainer).css('background-position', 'center');
initAudio(e.currentTarget.dataset.id);
}
}).appendTo('.pl-singular-playlist');
})
})
}
这是该项目目前我有,所以你可以看到它的外观(按钮显示在悬停):
https://aviadweiss.github.io/playlists/
会感谢你的帮助
答
我认为你需要底部的.appendTo(div);
。
现在,您将每个按钮附加到全部元素与类pl-singular-playlist
。
+0
谢谢,效果很好! –
你可以显示json结构吗? –