0

使用 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没有生成 s 或没有返回搜索结果,但是如果我删除SC.oEmbed()调用并将其替换为:

newDiv.innerHTML=track.permalink_url;

然后我会得到一个很好的搜索结果 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()那么我对这些动态创建的元素的调用有什么问题呢?

4

1 回答 1

1

解决了。SC我从回调函数中取出参数 and 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>
于 2013-03-12T08:08:02.840 回答