联系我 登录

jwPlayer播放器使用方法和参数

kevin.Zhu 发布于：2017-11-16 10:50　分类：Html5 　有 25 人浏览，获得评论 0 条　　

http://blog.csdn.net/salestina/article/details/53079038


  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.  <title>jwplayer播放器测试</title>  
  5.  <script type="text/javascript" src="scripts/jquery-1.8.3.min.js"></script>  
  6.  <script type="text/javascript" src="scripts/jwplayer.js"></script>  
  7. <!-- jwplayer播放器的key是在官方网站注册之后才会给的，没有这个key就不能使用播放器，下面是我申请的key -->  
  8.   <script type="text/javascript">jwplayer.key="W+FSSIJICMeqqi4MQCwmdLePq9iq8HQqiVT5dQ==";</script>  
  9. </head>  
  10. <body>  
  11.   
  12. <div id="container"></div>    
  13. <input type="button" class="player-play" value="播放" />    
  14. <input type="button" class="player-stop" value="停止" />    
  15. <input type="button" class="player-status" value="取得状态" />    
  16. <input type="button" class="player-current" value="当前播放秒数" />    
  17. <input type="button" class="player-goto" value="转到第4秒播放" />    
  18. <input type="button" class="player-length" value="视频时长(秒)" />  
  19.   
  20.    
  21. </body>  
  22. <script type="text/javascript">    
  23.     var temp = 1;  
  24.     $(function() {    
  25.   
  26.   
  27.   var playerInstance = jwplayer('container');  
  28.   //初始化视频  
  29.   playerInstance.setup({  
  30.     //视频文件来源  
  31.        file: 'scripts/video.mp4',  
  32.        //显示的背景图片  
  33.        image: 'scripts/bg.jpg',  
  34.        
  35.    });  
  36.   /*playerInstance.on('pause',function(obj){  
  37.   
  38.    alert(obj.oldstate);  
  39.   });*/  
  40.   playerInstance.on('complete',function(){  
  41.   
  42.     alert("播放完毕");  
  43.   
  44.   });  
  45.   //监控播放时间  
  46.   playerInstance.on('time',function(obj){  
  47.     //总时间  
  48.     //alert(obj.duration);  
  49.     //获取当前的播放时间  
  50.     var time = obj.position;  
  51.     var v1 = parseFloat(time.toFixed(0));  
  52.     //不回答问题不能进行播放下面的视频  
  53.     if(v1 > 3 && temp ==1){  
  54.   
  55.      playerInstance.seek(3);  
  56.     }  
  57.     var v2 = parseFloat("3");  
  58.     if(v1 == v2){  
  59.      if(temp == 1){  
  60.      playerInstance.pause();  
  61.   
  62.      var name = prompt("请输入您的名字","");  
  63.      if(name == "高旭旭"){  
  64.   
  65.       temp += 1;  
  66.       playerInstance.play();  
  67.       }  
  68.     }  
  69.    }  
  70.   });  
  71.   //点击播放执行的事件  
  72.   /*playerInstance.on('play',function(){  
  73.   
  74.     var time = playerInstance.getPosition();  
  75.     var v1 = parseFloat(time.toFixed(0));  
  76.     if(v1 > 3 && temp ==1){  
  77.   
  78.      playerInstance.seek(4);  
  79.     }  
  80.      
  81.   });*/  
  82.   //缓冲  
  83.   /*playerInstance.on('buffer',function(obj){  
  84.   
  85.    var name = obj.reason;  
  86.    if(name == "loading"){  
  87.   
  88.     alert("正在缓冲");  
  89.    }  
  90.   
  91.   });*/  
  92.   //在播放之前触发的时间  
  93.   playerInstance.on('playAttempt',function(){  
  94.   
  95.    alert("开始播放了，是否检测登录?");  
  96.      
  97.   });  
  98.   //加载视频的时间  
  99.   /*playerInstance.on('firstFrame',function(obj){  
  100.   
  101.    alert("加载视频时间:"+(obj.loadTime/1000));  
  102.   });*/  
  103.   
  104.   playerInstance.on('error',function(){  
  105.   
  106.    alert("视频出错了...");  
  107.    playerInstance.play();  
  108.   });  
  109.   //停止播放  
  110.   $(".player-stop").click(function(){  
  111.   
  112.    playerInstance.pause();  
  113.   
  114.   });  
  115.   //播放  
  116.   $(".player-play").click(function(){  
  117.   
  118.    playerInstance.play();  
  119.   });  
  120.   //获取当前播放的秒数（时间）  
  121.   $(".player-current").click(function(){  
  122.   
  123.    var time = playerInstance.getPosition();  
  124.    alert(time);  
  125.   });  
  126.   //转到多长时间  
  127.   $(".player-goto").click(function(){  
  128.   
  129.    playerInstance.seek(4);  
  130.   
  131.   });  
  132.   //获取播放状态  
  133.   $(".player-status").click(function(){  
  134.      
  135.    /**4种状态  
  136.     * 1:没有播放 idle  
  137.     * 2：正在播放playing  
  138.     * 3:停止paused  
  139.     * 4:播放完毕complete  
  140.     */  
  141.    alert(playerInstance.getState());  
  142.   });  
  143.   
  144.        });  
  145. </script>    
  146. </html>  

上一篇：gitbook使用说明
下一篇：视频播放器之————JW Player参数详解
Powered by emlog  Themes by Liuzp