網頁上播放音檔(中文)

文字轉音檔

ttsmaker 是一個免費的文字轉音檔的網站， 介面簡單明瞭且功能強大，可選擇轉換多種語言。

製作完音檔，與網頁放在一起

簡單的 html + javascript 即可完成

<div class="container">
   	<audio id="audioPlayer" controls>
    	<source id="audioSource" src="unit_test_3/woman.mp3" type="audio/mpeg">
    	Your browser does not support the audio element.
    </audio>
</div>
<button type="button" class="btn btn-info" onclick="playAudio('audio/woman.mp3')">woman</button>

<script>
function playAudio(filename) {
  var audioPlayer = document.getElementById('audioPlayer');
  var audioSource = document.getElementById('audioSource');

  // 更新音頻文件的路徑
  audioSource.src = filename;

  // 重新載入音頻文件
  audioPlayer.load();

  // 開始播放
  audioPlayer.play();
}
</script>

目前幾乎所有的瀏覽器都支援

Ref: w3schools

完成 !!