当我从<a> tag?

Question

I made a list of songs in my <a> tags, and I want the mp3 player to be universal for every song, so when i click on one song(link) from the list it would be played on the player, and it wouldn't have to refresh the page, or open it in another tab to play the song?

Here is my HTML:

<audio preload="auto" src="#"></audio>

<a class="trigger" href="#" data-src="audio/song1.mp3">Song #1</a>
<a class="trigger" href="#" data-src="audio/song2.mp3">Song #2</a>
<a class="trigger" href="#" data-src="audio/song3.mp3">Song #3</a>
<a class="trigger" href="#" data-src="audio/song4.mp3">Song #4</a>

Answer 1

由于您使用jQuery标记了问题，因此您只需使用它来设置src元素的audio属性即可。像这样：

$('a').on('click', function () {
    $('audio').prop('src', $(this).data('src'));
});