2012-08-26 26 views
1
function media() { 
    var div = document.createElement("div"); 
    div.setAttribute("class", "container"); 
    foo.appendChild(div); 

    var audio = document.createElement("audio"); 
    audio.setAttribute("controls", "controls"); 

    var source = document.createElement("source"); 
    source.setAttribute("src", "media/dimples.ogg"); 
    source.setAttribute("type", "audio/ogg"); 
    source.setAttribute("src", "media/dirty_feeling.ogg"); 
    source.setAttribute("type", "audio/ogg"); 
    source.setAttribute("src", "media/suzieq.ogg"); 
    source.setAttribute("type", "audio/ogg"); 
    source.setAttribute("src", "media/wear_my_ring.ogg"); 
    source.setAttribute("type", "audio/ogg"); 
    audio.appendChild(source); 

    div.appendChild(audio); 

    var ul = document.createElement("ul"); 
    ul.setAttribute("id", "playlist"); 

    var li = document.createElement("li"); 
    var a = document.createElement("a"); 
    a.setAttribute("href", "#song1"); 
    var text = document.createTextNode("Dimples"); 
    a.appendChild(text); 
    li.appendChild(a); 
    ul.appendChild(li); 

    li = document.createElement("li"); 
    a = document.createElement("a"); 
    a.setAttribute("href", "#song2"); 
    text = document.createTextNode("Dirty Feeling"); 
    a.appendChild(text); 
    li.appendChild(a); 
    ul.appendChild(li); 

    li = document.createElement("li"); 
    a = document.createElement("a"); 
    a.setAttribute("href", "#song3"); 
    text = document.createTextNode("Suzie Q"); 
    a.appendChild(text); 
    li.appendChild(a); 
    ul.appendChild(li); 

    li = document.createElement("li"); 
    a = document.createElement("a"); 
    a.setAttribute("href", "#song4"); 
    text = document.createTextNode("Wear My Ring"); 
    a.appendChild(text); 
    li.appendChild(a); 
    ul.appendChild(li); 

    div.appendChild(ul); 

    foo.lastChild.scrollIntoView(); 
    musicColors(); 
} 

這是我第一次嘗試創建媒體播放器。它必須在Javascript中,我拒絕使用jQuery(請不要jQuery建議)。Javascript HTML5音頻 - 哪些功能在addEventListner中引用歌曲?

我有兩個問題,請: 1)所有的歌曲鏈接融合在一起。爲什麼這是因爲每個李是ul的孩子? 2)我打算爲歌曲鏈接創建一個addEventListner,但我不確定實際播放歌曲的函數是什麼引用的?

+1

1.檢查你的CSS,2.什麼? – Musa

回答

-1

我有一個全局的ul = display:inline我沒有看到。

需要爲每首新歌曲重新分配音頻src。我做了使用JavaScript音頻對象,並重新使用每個歌曲的對象。