Добавляем это:
<script>
var previons=100; // любое число, превышающее количество тегов аудио
var alles_audio=document.getElementsByTagName("audio");
for(i=0;i<alles_audio.length;i++){
alles_audio[i].id=i;
alles_audio[i].onplay=function(){
if(previons!=100){alles_audio[previons].pause()};
this.play();
previons=this.id;
}
}
</script>
Я ещё хотел сказать, что отдельный тег аудио для каждой песни делать не рентабельно, это - излишняя загрузка процессора и влечёт за собой проблему избежания одновременной игры треков. Можно сделать, чтобы тег аудио на странице был только один, а кликая по названию песни в треклисте изменять его свойство src и по-новой запускать:
<style>
li:hover{
width:100px;
background:gold;
cursor:pointer;
}
</style>
<audio id=audio src="sound1.mp3" controls></audio>
<ul>
<li id="sound1.mp3">sound1</li>
<li id="sound2.mp3">sound2</li>
<li id="sound3.mp3">sound3</li>
<li id="sound4.mp3">sound4</li>
<li id="sound5.mp3">sound5</li>
</ul>
<script>
var alles_li=document.getElementsByTagName("li");
for(i=0;i<alles_li.length;i++){
alles_li[i].onclick=function(){
audio.src=this.id;
audio.play();
}
}
</script>
Вместо элементов списка можно использовать ссылки или кнопки. А многотежье аудио есть смысл применять там, где действительно нужно накладывать аудиосигналы, на пример, для работы многоканального трекера.