在播放器不可見時自動播放帶有 HTML5 嵌入標簽的音頻

Question

我想自動播放 MP3 音頻文件，但不希望播放器可見。

<div id="music"><embed src="Comfortably_Numb.mp3" autostart=true loop=false></div>

當我使用 css 將display:none添加到音頻標簽時，它根本不播放音樂。 有人可以解釋我如何在不顯示播放器的情況下播放音樂嗎？

Answer 1

或者，您可以嘗試基本的東西來滿足您的需求，

<audio autoplay loop>
      <source src="johann_sebastian_bach_air.mp3">
</audio>

如需進一步參考， 請單擊此處

Answer 2

如果您使用的是 React，請確保將自動播放設置為，

autoPlay

React 希望它是駝峰式的！

Answer 3

有時需要自動播放。 有人曾經指出，著名的 Les Paul Google Doodle (2011) 需要自動播放，即使在您將鼠標懸停在吉他弦上時才會播放聲音。 如果它以一流的設計和出色的設計完成，它會很漂亮（尤其是具有沉浸式設計的電影網站）

Answer 4

您可以使用這個簡單的代碼：

<embed src="audio.mp3" AutoPlay loop hidden>

在這里看到的結果： https : //hataken.000webhostapp.com/list-anime.html

Answer 5

“敏感”時代

今天的現代瀏覽器似乎（默認情況下）阻止了這些自動播放功能。 它們在某種程度上被視為流行音樂。 非常具有侵入性。 所以是的，用戶現在可以完全控制播放聲音的時間。 ^[1,2,3]

HTML5時代

<audio controls autoplay loop hidden>
    <source src="audio.mp3" type="audio/mpeg">
</audio>

HTML 的早期

<embed src="audio.mp3" style="visibility:hidden" />

參考文獻

1. Jer Noble， iOS 的新 <video> 政策，WebKit，鏈接
2. 在 Firefox 中允許或阻止媒體自動播放，FireFox 幫助，鏈接
3. Mounir Lamouri，統一自動播放，Chromium 博客，鏈接
4. 嵌入內容，萬維網聯盟， 鏈接

Answer 6

我用這個代碼，

 <div style="visibility:hidden">
    <audio autoplay loop>
        <source src="Aakaasam-Yemaaya Chesave.mp3">
    </audio> 
</div>

它運行良好，但我想要停止和暫停按鈕。 所以，如果我們不想聽，我們可以停下來。

Answer 7

<div id="music">
<audio autoplay>
  <source src="kooche.mp3" type="audio/mpeg">
  <p>If you can read this, your browser does not support the audio element.</p>
</audio>
</div>

和CSS：

#music {
  display:none;
}

就像上面建議的那樣，您可能應該擁有某種形式的控件。 也許使用通過 jquery 滑動控件的切換鏈接/復選框。

來源： HTML5 音頻自動播放

Answer 8

你可以使用這個代碼，它對我有用

<div style="visibility:hidden">
    <audio autoplay loop>
        <source src="../audio/audio.mp3">
    </audio> 
</div>

Answer 9

供以后找到此頁面的人參考，您可以使用：

<audio controls autoplay loop hidden>
<source src="kooche.mp3" type="audio/mpeg">
<p>If you can read this, your browser does not support the audio element.</p>
</audio>

Answer 10

我所做的是這樣的：

<div>
   <embed src="sample.mp3" autostart=true loop=false width="1px" height="1px">
</div>

您仍然會聽到頁面上的音頻自動播放，但您看不到它，而且您的代碼中幾乎不需要空間！ “雙贏！”