Javascript 在鼠标单击上更改视频？_Javascript_Video_Html_User Input

Javascript 在鼠标单击上更改视频？

javascript video html

Javascript 在鼠标单击上更改视频？,javascript,video,html,user-input,Javascript,Video,Html,User Input,我有两个视频，我想循环第一个视频，直到用户单击鼠标，此时我想切换到播放第二个视频。有人知道最好的方法是什么吗编辑：抱歉，澄清一下，我更喜欢使用HTML5（假设这是可能的）。我正在尝试无缝地交换这两个视频，一个接一个。我希望它看起来像是点击鼠标使视频完成或进展。所以我需要暂停/隐藏第一个，然后显示/播放第二个更新：在Galen的帮助和一些谷歌搜索的帮助下，我找到了答案： <html xmlns="http://www.w3.org/1999/xhtml"> <script t

我有两个视频，我想循环第一个视频，直到用户单击鼠标，此时我想切换到播放第二个视频。有人知道最好的方法是什么吗

编辑：抱歉，澄清一下，我更喜欢使用HTML5（假设这是可能的）。我正在尝试无缝地交换这两个视频，一个接一个。我希望它看起来像是点击鼠标使视频完成或进展。所以我需要暂停/隐藏第一个，然后显示/播放第二个

更新：在Galen的帮助和一些谷歌搜索的帮助下，我找到了答案：

<html xmlns="http://www.w3.org/1999/xhtml">
<script type="text/javascript">
function swapVideos() {
    var video1 = document.getElementsByTagName('video')[0];
    video1.pause();
    video1.style.display = 'none';
    var video2 = document.getElementsByTagName('video')[1];
    video2.play();
}
</script>
<body>
<video src="video1.ogg" controls="controls" loop="loop" autoplay="autoplay" onclick="swapVideos();">
your browser does not support the video tag
</video>
<video src="video2.ogg" controls="controls" preload="preload">
your browser does not support the video tag
</video>
</body>
</html>


函数swapVideos（）{
var video1=document.getElementsByTagName（'video'）[0]；
视频1.暂停（）；
video1.style.display='none'；
var video2=document.getElementsByTagName（'video'）[1]；
视频2.播放（）；
}
您的浏览器不支持视频标记
您的浏览器不支持视频标记

很难具体说明您提供的信息，但您可以使用javascript或jquery来实现这一点。将单击事件绑定到DOM元素，然后单击更改视频源。我假设视频是由swf中的源参数确定的。

将此代码添加到所需的任何单击事件中

// pause first video
var video1 = document.getElementsByTagName('video')[0];
video1.pause();
// play second video
var video2 = document.getElementsByTagName('video')[1];
video2.play();

添加此项以创建第一个视频循环

var video1 = document.getElementsByTagName('video')[0];
video1.addEventListener('ended', function () {
    video1.play();
});

根据标签，这看起来像HTML5视频，而不是Flash。是的，对不起，我对HTML5感兴趣，但我不知道这是否可能，所以我没有指定。谢谢！有可能隐藏视频1吗？我希望video2看起来像video1的延续。