Phiên bản Safari dành cho máy tính để bàn Mac: Sự kiện HTML 5 âm thanh "đã kết thúc" không kích hoạt sự cố

Question

Tôi chỉ muốn phát một số tệp âm thanh theo tuần tự bằng chức năng Âm thanh HTML5. Vào cuối mỗi lần phát, sự kiện "đã kết thúc" sẽ kích hoạt để tải âm thanh tiếp theo. Nhưng trong Safari 5.1 dành cho máy tính để bàn (trên Mac), tôi thấy sự kiện "đã kết thúc" chỉ được kích hoạt vào cuối lượt phát đầu tiên. Sau khi tải và phát âm thanh thứ hai, sự kiện "đã kết thúc" không kích hoạt lại ngay cả khi phát âm thanh đã kết thúc (tôi đã theo dõi sự kiện này bằng sự kiện "timeupdate"). Ngay cả khi tôi đã phát bất kỳ tệp âm thanh nào khác theo cách thủ công, sự kiện "đã kết thúc" đã không kích hoạt lại. Nhưng trong Chrome và safari di động, vấn đề này dường như không tồn tại và trình phát âm thanh có thể phát từ âm thanh đầu tiên đến âm thanh cuối cùng liên tục. Đây có phải là lỗi của Safari 5.1 dành cho Mac OS X không? (Tôi đã không thử nghiệm nó trong Windows)

Hiện tại, tôi chỉ có thể sử dụng sự kiện "timeupdate" để kiểm tra xem vở kịch đã kết thúc hay chưa.

Answer 1

Vâng, đây là một lỗi gây phiền nhiễu. Bạn có thể giải quyết vấn đề này bằng cách thay đổi id của phần tử âm thanh cho từng tệp. Dưới đây là một số mã mẫu để có ý tưởng:

<div id="audioDiv"> 
<audio id="audio0" src=""> 
    <h1>Your browser does not support the audio tag.</h1> 
</audio> 
</div> 

<script> 
var audioCounter = 0; 

function next() { 
audioCounter++; 
document.getElementById('audioDiv').innerHTML = '<audio id="audio' + audioCounter + '" src="file.mp3"></audio>'; 
document.getElementById('audio' + audioCounter).addEventListener('ended', next, false); 
document.getElementById('audio' + audioCounter).play(); 
} 

</script>