抑制加載媒體資源失敗

Question

我的 html 中有一個音頻標簽，其中有 src=""。 當我播放音樂時，我從 javascript 更改 src 值。 但是，在加載頁面時，出現錯誤

無效的 URI。 媒體資源加載失敗。 game.php 所有候選資源加載失敗。 媒體加載暫停。

我知道為什么，源邏輯上不存在。 有什么方法可以告訴音頻元素不要從頭開始加載 src 嗎？

<div style="display: none;" >
<audio tabindex="0" id="audio" controls preload="auto" loop="true">
    <source src="">
</audio>
</div>

謝謝

Answer 1

只需創建沒有任何<source>的<audio>元素，例如

<audio tabindex="0" id="audio" controls preload="auto" loop="true">
</audio>

然后在運行時添加一個<source> ，無論何時需要/檢查/驗證，例如：

var audio = document.getElementsByTagName('audio')[0];
  
var source = document.createElement('source');console.log(source);
source.setAttribute('src','http://somewhere');
  
audio.appendChild(source);

Answer 2

從初始 html 中刪除<source>然后...

var a = new Audio('someaudio.mp3');

// File does not exist
a.onerror = function() {
    //nothing
};
//File exists
a.onloadeddata = function() {
    //add source from javascript
};