2013-10-26 134 views
-1

我在我的网站上有一个视频和一个应该与另一个视频交换显示视频的按钮。当我这样做的时候,它可以工作,但是第一个显示的视频在改变后在后台播放(我可以在这里听到它的声音)。我想暂停第一个视频/在播放它之前停止播放它,但这不起作用。代码被完全替换,但为什么第一个视频仍在后台播放?任何提示?谢谢!使用JQuery/JavaScript暂停视频播放

<video id="video" controls="controls" autoplay="autoplay" loop="loop"> 
<source src="inc/1.mp4" type="video/mp4"> 
<source src="inc/1.webm" type="video/webm">    
</video> 
<div class="video-active" movie="one">Active Video</div> 


$(function() { 
    $(".section-video-button").on("click", function() { 
     document.getElementById('video').pause(); 
     if ($('.video-active').attr('movie') == 'one') { 
      $('#video').replaceWith('<video id="video" controls="controls" autoplay="autoplay" loop="loop"><source src="inc/2.mp4" type="video/mp4"><source src="inc/2.webm" type="video/webm"></video>'); 
      $('.video-active').attr('movie','two'); 
     } else { 
      $('#video').replaceWith('<video id="video" controls="controls" autoplay="autoplay" loop="loop"><source src="inc/1.mp4" type="video/mp4"><source src="inc/1.webm" type="video/webm"></video>'); 
      $('.video-active').attr('movie','one'); 
     } 

     $('#video').load(); 
    }); 
}); 
+0

你为什么不改变视频的src而不是你在这里? –

回答

1

更新jQuery页面以包含用于播放和暂停视频的javascript/jQuery代码。

$("video").trigger("play"); 
$("video").trigger("pause"); 
0

尝试使用.html()而不是使用replaceWith(),或者只是更改SRC属性,而不是插入整个代码。

也可以尝试使用.stop()函数。

相关问题