關閉所有的HTML5視頻

我正在尋找一種方法來關閉一個網站上的所有HTML5視頻與一個視頻。我正在開發一個使用模態窗口顯示內容的應用程序。其中一些內容是HTML5視頻。當用戶播放視頻，然後決定關閉包含該視頻的模式窗口時，我希望視頻停止播放。關閉所有的HTML5視頻

我已經試過像的方法如下：

function stopVideo() { 
    // Make sure to turn off and reset the video 
    $('.html5-video').each(function(index, element) { 
     $(this).get(0).currentTime = 0; 
     $(this).get(0).pause(); 
    }); 
}

這工作正常，在Safari中;然而，在FireFox和Chrome中，它會拋出一個錯誤，指出因爲該元素被隱藏，所以不再可用。有誰知道如何可靠地停止所有視頻？

謝謝！

來源

2011-12-20 tollmanz

首先，您應該瞭解一些關於jQuery的知識。每次調用$（）（帶有一些參數）時，都會創建一個新的jQuery對象，這對性能不利。如果你做的到$（）使用相同的參數調用，你應該緩存的結果，所以你的情況，這將是：

var video_object = $(this).get(0); 
video_object.currentTime = 0; 
video_object.pause();

其次，當你在每個循環與jQuery，在上下文你的函數（this）和第二個參數是html對象。所以把它們包裝在一個$（）方法中，然後做一個.get（0）是沒有意義的。

因此，這是與您的方法：

function stopVideo() { 
    // Make sure to turn off and reset the video 
    $('.html5-video').each(function(index, element) { 
     element.currentTime = 0; 
     element.pause(); 
    }); 
}

回到你的問題了。你能舉一個例子，或者更多的細節，因爲上面的代碼似乎對我來說沒有錯誤（http://jsfiddle.net/klaascuvelier/fypAR/）

來源

2011-12-20 15:18:58

感謝您的提示！我確實需要在這裏做一些優化。在我舉出一個例子之前，你能看看它是否適用於Firefox和Chrome？它在Safari中適用於我。此外，問題似乎是HTML5視頻元素被隱藏在一個隱藏的元素中，因此我得到錯誤的原因。 – tollmanz 2011-12-20 15:35:37

我意識到之前的評論聽起來像我沒有在FF或Chrome中檢查過它。我有，那是錯誤發生的地方。它在Safari中不會發生。 – tollmanz 2011-12-20 16:48:33

檢查我以前的帖子中的jsfiddle鏈接，這是我在Chrome和Firefox中嘗試的，都適用於我。 – 2011-12-20 17:41:24

關閉所有的HTML5視頻

回答

相關問題