Question

如何用html和js写视频播放切换

通过点击图标实现视频播放切换

for(var i=0;i<video_photo.length;i++){
video_photo[i].id = i;
video_photo[i].onclick = function(){
video[0].src="video/"+i+".mp4";
alert(video[0].src);
}
}
在控制台看确实发生变化了，应该可以实现，但是顶部的播放器中的视频并没有发生变化，那应该怎么写。

Answer 1

如果直接改变原有video 的 src 属性无效，可以删掉原有的video或者隐藏起来，新建一个 video 元素实现切换

Answer 2

Answer 3

<video id="video" width="900" height="450" controls >
<source id= src="" type="">
<source src="movie.ogg" type="video/ogg">
</video>
-----以上为界面video标签-------
-----下边是js代码，灵活改变视频路径及类型-------
var videoT = document.getElementById('video');
var videoObj=getVideoObj();//此处自行写获取视频信息代码
var videoPath=videoObj.videopath;//视频路径
var videotype=videoObj.videotype;//视频格式
//如果视频路径不为空
if(null!=videoPath&&""!=videoPath){
videoT.src=videoPath;//动态改变视频路径
videoT.type="video/" + videotype;//动态改变视频格式
videoT.play();//自动播放
}
需要注意的是，改变路径的时候是改变的外城标签<video>而不是<source>