我想用Jplayer创建一个javascript播放列表。这是一个不错的简单工具,但是我从未用javascript编写过代码。
查看此demo中使用的javascript。它使用一个列表来存储MP3和Ogg文件:
var myPlayList = [
{name:"Tempered Song",mp3:"http://www.miaowmusic.com/mp3/Miaow-01-Tempered-song.mp3",ogg:"http://www.miaowmusic.com/ogg/Miaow-01-Tempered-song.ogg"},
{name:"Hidden",mp3:"http://www.miaowmusic.com/mp3/Miaow-02-Hidden.mp3",ogg:"http://www.miaowmusic.com/ogg/Miaow-02-Hidden.ogg"},
{name:"Lentement",mp3:"http://www.miaowmusic.com/mp3/Miaow-03-Lentement.mp3",ogg:"http://www.miaowmusic.com/ogg/Miaow-03-Lentement.ogg"},
{name:"Lismore",mp3:"http://www.miaowmusic.com/mp3/Miaow-04-Lismore.mp3",ogg:"http://www.miaowmusic.com/ogg/Miaow-04-Lismore.ogg"},
{name:"The Separation",mp3:"http://www.miaowmusic.com/mp3/Miaow-05-The-separation.mp3",ogg:"http://www.miaowmusic.com/ogg/Miaow-05-The-separation.ogg"},
{name:"Beside Me",mp3:"http://www.miaowmusic.com/mp3/Miaow-06-Beside-me.mp3",ogg:"http://www.miaowmusic.com/ogg/Miaow-06-Beside-me.ogg"},
];
所以现在,我只使用django模板(但它可能是另一个模板引擎)来创建这个变量。但是,我想使用javascript函数动态创建此列表(myPlayList
),该函数将从HTML代码中检索MP3网址和Ogg vorbis网址。
因此,从这个HTML代码......:
<body>
<article id="track-0">
<h1>lorem ipsum</h1>
<ul>
<li><a href="...">Mp3</a></li>
<li><a href="...">Vorbis</a></li>
<li><a href="...">Flac</a></li>
</ul>
</article>
<article id="track-1">
<h1>lorem ipsum</h1>
<ul>
<li><a href="...">Mp3</a></li>
<li><a href="...">Vorbis</a></li>
<li><a href="...">Flac</a></li>
</ul>
</article>
<article id="track-2">
<h1>lorem ipsum</h1>
<ul>
<li><a href="...">Mp3</a></li>
<li><a href="...">Vorbis</a></li>
<li><a href="...">Flac</a></li>
</ul>
</article>
</body>
...我需要构建一个这样的javascript列表(其中列表的每个索引代表HTML中的track-ID
:
var files = [
{mp3:"...", ogg:"..."},
{mp3:"...", ogg:"..."},
{mp3:"...", ogg:"..."},
];
请原谅我丑陋的英语。如果您需要更多信息,请告诉我。
谢谢。 : - )
答案 0 :(得分:2)
我会为每个链接添加一个类,例如:
<a class="mp3_link" href="...">Mp3</a>
然后,您可以执行以下操作:
$("article").each(function() {
var mp3_url = $("a.mp3_link", this).attr('href');
// Keep going and build your data structure
});
答案 1 :(得分:2)
这可以通过多种方式完成,以下是一种可能性:
var files = [];
$('article').each(function() {
files.push({
mp3: $('li:nth-child(1) a', this).attr('href'),
ogg: $('li:nth-child(2) a', this).attr('href')
});
});