使用Soundcloud JavaScript API,我想使用跟踪搜索结果动态生成一个播放器小部件页面。我的代码如下:
<html>
<head>
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script>
function makeDivsFromTracks(tracks,SC)
{
var track;
var permUrl;
var newDiv;
for(var ctr=0;ctr<tracks.length;ctr++)
{
newDiv=document.createElement("div");
newDiv.id="track"+ctr;
track=tracks[ctr];
SC.oEmbed(track.permalink_url,{color:"ff0066"},newDiv);
document.body.appendChild(newDiv);
}
}
</script>
</head>
<body>
<script>
SC.initialize({
client_id: 'MY_CLIENT_ID'
});
SC.get('/tracks',{duration:{to:900000},tags:'hitech',downloadable:true},
function(tracks,SC)
{
makeDivsFromTracks(tracks,SC);
});
</script>
</body>
</html>
当我加载它时,SC.oEmbed()
调用会抛出错误:
Uncaught TypeError: Cannot call method 'oEmbed' of null
似乎表明没有生成div
或者没有返回搜索结果,但是如果我删除SC.oEmbed()
调用并将其替换为:
newDiv.innerHTML=track.permalink_url;
然后我得到了一个很好的搜索结果网址列表。
如果我使用静态div
和静态URL创建窗口小部件,例如
<body>
<div id="putTheWidgetHere"></div>
<script>
SC.initialize({
client_id: 'MY_CLIENT_ID'
});
SC.oEmbed("http://soundcloud.com/exampleTrack", {color: "ff0066"}, document.getElementById("putTheWidgetHere"));
</script>
</body>
然后也可以正常工作。那么我的oEmbed()
调用这些动态创建的元素有什么问题呢?
答案 0 :(得分:1)
解决了它。我从回调函数和SC
中取出makeDivsFromTracks()
参数,现在所有玩家都出现了。不确定为什么这样做 - 也许它与SDK脚本引用中定义的SC对象有关,所以它是全局可用的,不需要传递给函数?
无论如何,工作代码是:
<html>
<head>
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script>
function makeDivsFromTracks(tracks)
{
var track;
var permUrl;
var newDiv;
for(var ctr=0;ctr<tracks.length;ctr++)
{
newDiv=document.createElement("div");
newDiv.id="track"+ctr;
track=tracks[ctr];
//newDiv.innerHTML=track.permalink_url;
SC.oEmbed(track.permalink_url,{color:"ff0066"},newDiv);
document.body.appendChild(newDiv);
}
}
</script>
</head>
<body>
<script>
SC.initialize({
client_id: 'MY_CLIENT_ID'
});
SC.get('/tracks',{duration:{from:180000,to:900000},tags:'hitech',downloadable:true},function
(tracks){makeDivsFromTracks(tracks);});
</script>
</body>
</html>