JavaScript的音頻對象對HTML5音頻標籤

在項目最近，當我加載的聲音與JavaScript的音頻對象對HTML5音頻標籤

var myAudio = new Audio("myAudio.mp3"); 
myAudio.play();

除非對話打開它發揮罰款（即警告，確認）。然而，當我嘗試，而不是在我的HTML

<audio id="audio1"> 
    <source src="alarm.mp3" type="audio/mpeg" /> 
</audio>

添加音頻標籤和使用

var myAudio1 = document.getElementById("audio1"); 
myAudio1.play()

它繼續對話開幕後玩。有人知道爲什麼嗎？還有更普遍的兩種播放聲音的方式有什麼區別？

來源

2014-01-30 ekcrisp

到底在哪你得到從JavaScript的音頻對象？即什麼庫？ –

好問題，我不確定，我跟着幾個從stackoverflow的例子，這裏是我看到的一對夫婦，[ex1]（http://stackoverflow.com/questions/3273552/html-5-audio-looping），[ex2]（http：// stackoverflow。com/questions/9419263/playing-audio-with-javascript），後者有人建議將其作爲播放音頻的一種方式，「如果你不想混淆html元素」。我認爲這是純js，但我奇怪的是找不到任何文檔。我使用的唯一庫是jquery。很明顯，html標籤是首選，但我仍然對Audio對象感到好奇，如果你發現 – ekcrisp

據this wiki entry Mozilla的<audio>和new Audio()應該是相同的，但它不像是在實踐中的情況。每當我需要在JavaScript中創建音頻對象其實我只是創建一個<audio>元素是這樣的：

var audio = document.createElement('audio');

這實際上創建了一個音頻元素，您可以使用完全一樣在頁面的聲明的<audio>元素HTML。

要使用這個技術，你可以這樣做重新創建例如：警報期間

var audio = document.createElement('audio'); 
audio.src = 'alarm.mp3' 
audio.play();

來源

2014-02-01 00:48:04 pseudosavant

，你能解釋一下如何使用你的例子嗎？ – Damainman

@Damainman你想做什麼？我演示的例子將在JavaScript中創建和'

感謝您的回覆！在OP示例中，通過在html中手動創建音頻元素，他控制了該元素在html中的顯示位置。在你的例子中，因爲html元素是從js代碼動態創建的，所以它沒有解釋音頻元素是如何出現在頁面中的。讓我知道我所說的話沒有意義。 – Damainman

的JavaScript停止或確認框。

您不能同時運行代碼，並顯示alert()，confirm()，或prompt()，它的字面等待該用戶輸入，這是JavaScript的一個核心功能。

我認爲這就是爲什麼音頻文件完全在JavaScript範圍內播放的原因。即使JavaScript警報/確認/提示已打開，相對Flash視頻剪輯或HTML5音頻/視頻也會繼續播放。

至於什麼方法更好，那麼取決於你。使用alert/confirm/prompt中內置的JavaScript做任何事情都是非常古老的，有更好的方式來查看你可以使用jQuery UI等等。

如果您在頁面上有很多動態內容，或者您正在尋找背景緩衝音頻，然後才需要觸發等等，那麼JavaScript可能是更好的方法。

如果你在屏幕上只有一個玩家，那麼沒有理由不加入HTML代碼。儘管這些日子不太可能影響任何人，但在沒有理由的情況下依賴JavaScript的做法仍然是不好的做法。

來源

2015-01-07 03:02:37 Aaron

如果您將創建 - 那麼你將不得不在iOS上的問題，因爲它顯示即使您將設置寬度：0像素

來源

2016-01-14 14:48:39 nvvetal

'display：none;'應該是一個標準，支持所有瀏覽器。 – timmyRS

JavaScript的音頻對象對HTML5音頻標籤

回答

相關問題