2017-04-18 55 views
0

我見過其他主題,但其代碼非常複雜。我想讓地雷變得簡單,這樣我就可以輕鬆地理解它。我認爲這很容易,但結果很難。顯然,你不能通過改變它的屬性來改變音頻源。當複選框發生改變時,我希望音頻源發生改變,然後它會變成相應的音頻文件。無法更改音頻來源

HTML

<select id="ccw" onblur="check()"> 
<option>Lobby</option> 
<option>Autumn</option> 
<option>Winter</option> 
<option>Spring</option> 
<option>Summer</option> 
</select> 
<audio class="stage10" controls> 
<source src="default.mp3" type="audio/mpeg"> 
Audio element not supported by your browser 
</audio> 

JS

var songs = [ 
//lobby 
"default.mp3", 
//autumn 
"fall.mp3", 
//winter 
"the ice age.mp3", 
//spring 
"AHHHH ITS BEEEEEEEES.mp3", 
//summer 
"Da Summa of 1989 or was it 1998 i dont know.mp3" 

//please do not take notes of the file's names 
] 

$(function() { 
    $('#ccw').on('change', check) 
}) 
function check() { 
    var ccw = $('#ccw').val() 
    if (ccw == "Autumn") { 
     $('#stage10 source').attr('src', songs[1]) 
    } else if (ccw == "Winter") { 
     $('#stage10 source').attr('src', songs[2]) 
    } else if (ccw == "Spring") { 
     $('#stage10 source').attr('src', songs[3]) 
    } else if (ccw == "Summer") { 
     $('#stage10 source').attr('src', songs[4]) 
    } else { 
     $('#stage10 source').attr('src', songs[0]) 
    } 
    $('audio')[10].load() // this wasn't here before, but i tried testing with it. 
} 

我不清楚爲什麼這是行不通的。有人請幫助我!

回答

0

「#stage10」 是一個ID選擇,以」 .stage10" 取代它,如果你想通過類來選擇元素:

function check() { 
    var ccw = $('#ccw').val() 
    if (ccw == "Autumn") { 
     $('.stage10 source').attr('src', songs[1]) 
    } else if (ccw == "Winter") { 
     $('.stage10 source').attr('src', songs[2]) 
    } else if (ccw == "Spring") { 
     $('.stage10 source').attr('src', songs[3]) 
    } else if (ccw == "Summer") { 
     $('.stage10 source').attr('src', songs[4]) 
    } else { 
     $('.stage10 source').attr('src', songs[0]) 
    } 
    $('audio')[10].load() // this wasn't here before, but i tried testing with it. 
}