音頻不通過 javaScript 播放

Question

我遇到了音頻無法播放的問題，我不知道為什么。

我在這個 .ejs 文檔中有這個音頻標簽和按鈕，因為我使用的是 nodejs，它是這樣的：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title><%= title %></title>
</head>
<body>
    <audio id="audio">
        <source id="audioSource" src="" type="audio/mpeg"/>
        Your browser does not support the audio element.
    </audio>

    <button onclick="playAudio()" type="button">Play Audio</button>
    <button onclick="pauseAudio()" type="button">Pause Audio</button> 
    <button onclick="check()" type="button">Check Audio Status</button>

    <script src="/js/sum.js"></script> 
</body>
</html>

在底部，我在文檔中連接了一個 JavaScript 文檔每個按鈕都有一些功能播放、暫停和檢查狀態當瀏覽器啟動時，它應該開始播放我在音樂文件夾中的 4 個 mp3 文件之一也就是說，它會監聽音頻何時完成，然后選擇一個隨機數 1-4，並將音頻源設置為新聲音。


document.getElementById("audio").addEventListener("ended", myFunction);
const audio = document.getElementById("audio");
const source = document.getElementById('audioSource');

let firstTime = 0;

function check(){
   if (audio.duration > 0 && !audio.paused) {
       alert("audio is playing");
   } else {
       alert("audio is not playing");
   }
}


function myFunction() {
   const i = Math.floor(Math.random() * 4) + 1;
   source.src = `/music/sound${i}.mp3`;
   audio.play();
}

function playAudio() { 
   if (firstTime == 0){
       firstTime += 1;
       let i = Math.floor(Math.random() * 4) + 1;
       source.src = `/music/sound${i}.mp3`;
       audio.play();
   } else {
       audio.play(); 
   }
} 
function pauseAudio() { 
   audio.pause(); 
}

問題是，它沒有播放任何東西，我不知道為什么，任何幫助表示贊賞

從理論上講，它應該是這樣的 - 瀏覽器啟動，用戶點擊播放，然后在音頻后播放音頻，並具有暫停功能。

Answer 1

直接在audio元素上設置音頻源應該會有所幫助。 這是一個快速示例。

HTML：

<audio id="audioSource" src=""></audio>

JS：

const audioElement = document.getElementById("audioSource");
audioElement.src = `path/to/your.mp3`

您應該添加某種偵聽器以確保音頻也可以播放（有關詳細信息，請參閱 MDN ）。 這是上一個示例的擴展版本，您可以使用它來確保：

const audioElement = document.getElementById("audioSource");

function onCanPlay(e) {
  this.play();
}

audioElement.addEventListener("canplaythrough", onCanPlay);

audioElement.src = `path/to/your.mp3`

請注意，在附加“可以播放”的偵聽器后設置源很重要。

希望這可以幫助！ 祝你好運。

音頻不通過 javaScript 播放

問題描述

1 個解決方案

解決方案1
0 2021-10-28 23:04:13

HTML：

JS：

音頻不通過 javaScript 播放

問題描述

1 個解決方案

解決方案1 0 2021-10-28 23:04:13

HTML：

JS：

解決方案1
0 2021-10-28 23:04:13