Как получить несколько якорных URL с помощью jQuery? - PullRequest
Новая
       27

Как получить несколько якорных URL с помощью jQuery?

1 голос
/ 24 марта 2010

Я хотел бы создать список воспроизведения javascript с помощью Jplayer. Это хороший и простой инструмент, однако я никогда не программировал на javascript.

Посмотрите на 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 (но это может быть другой механизм шаблонов) для создания этой переменной. Однако я хотел бы создать этот список (myPlayList) динамически с помощью функции javascript, которая будет извлекать URL-адреса MP3 и URL-адреса Ogg vorbis из кода HTML.

Таким образом, из этого 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 (где каждый индекс списка представляет track-ID в HTML: 

var files = [
    {mp3:"...", ogg:"..."},
    {mp3:"...", ogg:"..."},
    {mp3:"...", ogg:"..."},
];

Пожалуйста, извините меня за мой уродливый английский. Если вам нужна дополнительная информация, просто скажите мне.

Спасибо. : -)

Ответы [ 2 ]

2 голосов
/ 24 марта 2010

Это можно сделать разными способами, одна из следующих возможностей: 

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')
    });
});
2 голосов
/ 24 марта 2010

Я бы добавил класс к каждой ссылке, например: 

<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
 });
...