HTML5 video循环播放多个视频的方法步骤

HTML5 video循环播放多个视频的方法步骤

这篇文章主要介绍了HTML5 video循环播放多个视频的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

最近在开发中遇到的需求是:微信扫描课件二维码,播放其对应的课件视频

设计流程

1.扫描二维码时,将其视频列表存入model中,存入第一条是为了,不在html界面重新获取第一条视频

 model.addAttribute("playUrl", videos.get(0).getVideoUrl()); model.addAttribute("videoUrls", JsonUtils.toJson(videos));

2.返回其对应的html界面

 return "client/coursePlayer.html";

3.使用video 播放视频第一条视频

 

4.用ended 监控视频播放进度

 

html界面如下:

   ${title} 

以上就是HTML5 video循环播放多个视频的方法步骤的详细内容,更多请关注易知道|edz.cc其它相关文章!

推荐阅读