zoukankan html css js c++ java

video 播放多个视频

老规矩：直接上代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <video  id="myvideo" width="500" height="auto" autoplay="autoplay" controls="controls" muted> 
                  你的浏览器不支持HTML5播放此视频
           <source src="" type='video/mp4' /> 
   </video>
   <button id="btn1">播放1</button>
   <button id="btn2">播放2</button>
  <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" ></script> 
    <script>  
        var video = document.getElementById("myvideo");  
        var vList = ['./images/老虎.mp4', './images/tanke.mp4']; // 初始化播放列表，这里的url要用相对路径  
        var vLen = vList.length; 
        var curr = 0;
        $(document).ready(function(){
            play(0);  
            $("#btn1").click(function(){
                play(0)
            })
            $("#btn2").click(function(){
                play(1)
            })
        });                    
        function play(num) {  
            video.src = vList[num];  
            video.load();   
            video.play();   
        }  
</script>
  </body>
</html>

查看全文

相关阅读:
Codeforces 716C[数论][构造]
HDU 5808[数位dp]
Codeforces 611d [DP][字符串]
Codeforces 404D [DP]
HDU 5834 [树形dp]
HDU 5521 [图论][最短路][建图灵感]
矩阵
 kruskal 处理最短路问题 A: 还是畅通工程
 Dijastra最短路 + 堆优化模板
 CodeForces

原文地址：https://www.cnblogs.com/xuwupiaomiao/p/15683838.html