Question

我想在jwplayer的HTML5模式下更改视频的播放速度。我对Flash浏览器不感兴趣，我们将仅限制HTML5浏览器的此功能

问题：我尝试在jwplayer中更改HTML5的播放速度，但回放速度未定义我附上我的代码

    jwplayer('my-video').setup({
                 sources: [
                      {file:'./test.mp4' , type: "mp4" },
                     ],
                 width:'640px',
                 height:'360px', 
                 image : './test.jpg'
              });
$("#speed_10").click(function() {
        myVid=$( "#my-video" ).find('.jwvideo').find('video');
        alert(myVid.length);

        alert($( "#my-video" ).find('.jwvideo').find('video').attr('src'))
        alert(myVid.playbackRate)
        alert($( "#my-video" ).find('.jwvideo').find('video').length)
        $( "#my-video" ).find('.jwvideo').find('video').PlaybackRate=0.5; 

 });

第1次提醒为1 第二次警报未定义
第3个警报显示“来源”
第4次提醒是1

我能够捕获div但无法在jquery中更改播放速率！

http://www.longtailvideo.com/support/forums/jw-player/feature-suggestions/32556/playbackrate-support/

按照上面的链接，我也尝试使用java脚本，并使用下面的代码

(document.getElementsByTagName('video')[0].playbackRate=0.2.

但如果我使用上面的代码，我如何将它用于多个视频，因为上面的代码中没有涉及ID [没有为上面的javascript传递唯一ID]

以下是jwplayer HTML5 structure of jwplayer

的div结构

Answer 1

我找到了这个问题的答案，我面对多个视频的主要问题是如何使每个视频都独一无二。我只需先按ID获取div，然后获取'Video'标签，而不是改变播放率添加以下代码

var video = document.getElementById(playerId)
var video_speed = video.getElementsByTagName('video')[0]
alert(video_speed.playbackRate)

video_speed.playbackRate=0.2;
alert(video_speed.playbackRate)

我甚至试过多个视频，它运行良好

Answer 2

只需在视频中添加ID，然后使用document.getElementsById（id）代替document.getElementsByTagName。

document.getElementsById('yourid').playbackRate=0.2

Answer 3

发现此脚本手动操作DOM以获得自定义速度：

<script type="text/javascript">
  jwplayer("video").setup({
      image: 'https://<your_CDN_ID>.cloudfront.net/static/splash/<splash.png>',
      width: 960,
      height: 600,
      flashplayer: "https://<your_CDN_ID>.cloudfront.net/assets/jwplayer.flash.swf",
      html5player: "https://<your_CDN_ID>.cloudfront.net/assets/jwplayer.html5.js",
      primary: 'html5',
      sources: [
          { file: 'https://<your_CDN_ID>.cloudfront.net/static/videos/<video>.mp4' },
          { file: 'https://<your_CDN_ID>.cloudfront.net/static/videos/<video>.webm' }
      ]
  });

  var tag;

  jwplayer().onReady(function(){
    if (jwplayer().getRenderingMode() == "flash") {
      return;
    }

    tag = document.querySelector('video');
    tag.defaultPlaybackRate = 1.0;
    tag.playbackRate = 1.0;

    jwplayer().addButton("https://<your_CDN_ID>.cloudfront.net/assets/25.png", "", function(){
      jwplayer().seek(jwplayer().getPosition());
      tag.playbackRate = 0.25;
    },"025");

    jwplayer().addButton("https://<your_CDN_ID>.cloudfront.net/assets/05.png", "", function(){
      jwplayer().seek(jwplayer().getPosition());
      tag.playbackRate = 0.5;
    },"05");

    jwplayer().addButton("https://<your_CDN_ID>.cloudfront.net/assets/1.png", "", function() {
      jwplayer().seek(jwplayer().getPosition());
      tag.playbackRate = 1.0;
    },"1");

    jwplayer().addButton("https://<your_CDN_ID>.cloudfront.net/assets/125.png", "", function() {
      jwplayer().seek(jwplayer().getPosition());
      tag.playbackRate = 1.25;
    },"125");

    jwplayer().addButton("https://<your_CDN_ID>.cloudfront.net/assets/15.png", "", function() {
      jwplayer().seek(jwplayer().getPosition());
      tag.playbackRate = 1.5;
    },"15");

    jwplayer().addButton("https://<your_CDN_ID>.cloudfront.net/assets/2.png", "", function() {
      jwplayer().seek(jwplayer().getPosition());
      tag.playbackRate = 2.0;
    },"2");

  });

</script>

而不是像Ethan的优秀博客那样切换速度按钮。

只需设置自定义速度：

document.querySelector('video').playbackRate=0.80;

Answer 4

https://developer.jwplayer.com/jw-player/demos/advanced/set-playback-rate/

仅在.setup（）

中添加行playbackRateControls

jwplayer('user-player').setup({
playlist: 'https://cdn.jwplayer.com/v2/media/gaCRFWjn',
  // Set the available playback rates of your choice
  playbackRateControls: [0.75, 1, 1.25, 1.5]
});

Answer 5

顺便说一下，我在JW播放器上写了一篇关于如何做到这一点的博客文章。它可能会有所帮助！ - http://www.longtailvideo.com/blog/33860/slow-motion-with-jw-player

如何在jwplayer中更改播放速率

5 个答案: