問題與視頻標籤。海報在視頻通話結束後不可見

Question

最初在視頻通話結束後視頻通話開始前，海報可見，我可以在視頻容器中看到黑色背景以代替海報。

下面是我用於此目的的html標記。

<div id="videoSmall"> 
    <video id="videoInput" autoplay width="240px" height="180px" poster="img/webrtc.png"></video> 
</div> 

我試圖重啓「videoInput」 div使用該代碼

var tag = $("#videoInput").clone(); 
$("#videoInput").replaceWith(tag); 

此代碼的工作，並帶來海報圖像回來，但這樣做的問題是，當我再次進行視頻通話，而無需刷新頁面..海報不爲了顯示視頻而消失。

Answer 1

您可以通過將ended eventListener添加到視頻元素並再次調用視頻load（）來完成此操作。

這裏是一個工作示例：CodePEN

HTML：

<video id="video" width="320" height="240" controls poster="http://www.w3schools.com/images/w3html5.gif"> 

    <source src="http://www.w3schools.com/html/movie.mp4" type="video/mp4"> 
    <source src="http://www.w3schools.com/html/movie.ogg" type="video/ogg"> 
    Your browser does not support the video tag. 
</video> 

的JavaScript/jQuery的：

var video= $('#video')[0]; 
var videoNew= $('#video');   
videoNew.on('ended',function(){ 
    video.load();  
});