如何防止HTML5音頻或視頻在從頁面中移除時播放？

請隨時爲本文提出更好的標題，因爲我不確定如何在一個簡短的問題中正確描述問題。如何防止HTML5音頻或視頻在從頁面中移除時播放？

我有一個帶HTML5播放器的媒體播放器頁面，以及訪問者選擇播放該頁面的視頻或音頻的選項。在播放時，可以使用切換到另一個的按鈕。例如，如果訪問者正在播放音頻，則可以使用「切換到視頻」按鈕，該按鈕基本上可以刪除當前內容並將其替換。當然，這也可以有效地從DOM樹中移除當前的HTML5播放器。除了替換內容之外，在加載新內容之前，頁面上的任何音頻或視頻元素都會觸發「暫停」事件。

不幸的是，如果您足夠快地在音頻和視頻之間切換，最終會同時播放多個項目。

我需要確保這不會發生。

如何確保在更換播放器時以前加載的文件無法播放？

要查看此情況，請轉至http://www.onlinechurchmediacenter.com/mc/vertigoelectric/5628，選擇音頻或視頻，一旦開始播放，請點擊播放器下方的「播放音頻」或「播放視頻」鏈接。如果您不斷快速點擊它，您將開始注意到音頻/視頻的多個實例正在彼此播放。

來源

2013-06-04 vertigoelectric

在開始播放新的元素之前，是否可以觸發所有播放元素的暫停事件？ – bpoiss

它應該是，但我不能得到它的工作。我認爲問題的一部分是技術上不再存在的元素，因此它們不能被觸發器瞄準，但它們的文件中的音頻仍然播放。 – vertigoelectric

我建議不要從DOM中刪除元素。只要隱藏它們並觸發暫停。爲了更好的衡量，在播放下一個項目之前觸發另一個暫停。

來源

2013-06-04 20:05:28 Morfie

我可以問我的老闆他是否希望我花費額外的時間來做到這一點，但它可能需要更多的重新設計/編碼，而不是價值。我考慮的一種可能的解決方法是在內容加載時暫時禁用或隱藏「切換」按鈕，從而防止快速點擊......您認爲這可以起作用嗎？ – vertigoelectric

這絕對可以工作。實際上過去是爲了防止人們重複提交表格。 – Morfie

我會試試看。我認爲唯一可能的缺點是如果這個問題與文件加載需要多長時間有關。對於速度較慢的系統，如果媒體加載時間比啓用按鈕需要的時間更長，則可能仍會發生。 – vertigoelectric

如何防止HTML5音頻或視頻在從頁面中移除時播放？

回答

相關問題