Video.js jQuery破坏了Firefox中的视频播放/暂停功能

时间:2016-01-18 21:10:04

标签: javascript html5 firefox moodle video.js

我正在尝试使用video.js来阻止Moodle网站上的mp4视频快进,但允许倒带。以下脚本适用于Chrome和Opera,但不适用于Firefox:

window.onload = function() {
  if ($('iframe').length > 0) {

    $('iframe').ready(function() {
      var videoPlayer = $('iframe').contents().find('video')[0];

      var cssLink = document.createElement("link")
      cssLink.href = "https://vjs.zencdn.net/5.0/video-js.min.css";
      cssLink.rel = "stylesheet";
      cssLink.type = "text/css";
      $('iframe').contents().find('head').append(cssLink);

      videojs(videoPlayer, {}, function() {
        var vjsPlayer = this;
        $('iframe').contents().find('video').prop('controls', 'true');
        $('iframe').contents().find('div .vjs-big-play-button').html('');
        $('iframe').contents().find('div .vjs-control-bar').html('');
        $('iframe').contents().find('div .vjs-caption-settings').html('');

        var currentTime = 0;

        vjsPlayer.on("seeking", function(event) {
          if (currentTime < vjsPlayer.currentTime()) {
            vjsPlayer.currentTime(currentTime);
          }
        });

        vjsPlayer.on("seeked", function(event) {
          if (currentTime < vjsPlayer.currentTime()) {
            vjsPlayer.currentTime(currentTime);
          }
        });

        setInterval(function() {
          if (!vjsPlayer.paused()) {
            currentTime = vjsPlayer.currentTime();
          }
        }, 1000);
      });
    });
  }
}

在Firefox中,实现了所需的效果(向前搜索不会改变视频的时间,但是向后搜索会有效),但播放/暂停功能会被破坏。如果我在任一方向上寻找了奇数次,则视频会暂停,并且仅在按住播放按钮时播放。如果我寻找偶数次(包括零),视频会播放,但暂停按钮不会执行任何操作。我在Microsoft Edge中获得了相同的结果,并发布了a question about that as well

我尝试在源标记中添加type="video/mp4"属性,但视频没有源标记。从this question的答案的最后一部分开始,我想这是因为源对用户是隐藏的。有没有办法查看/编辑源代码?我可以右键单击视频来获取链接,但页面的html中的视频没有源元素或scr属性。

以下是Chrome中的<video>标记:

<video autoplay="" name="media" id="vjs_video_3_html5_api" class="vjs-tech" controls=""><source src="https://localhost/pluginfile.php/26769/mod_resource/content/4/Sample%20Video.mp4" type="video/mp4">
  <source src="https://localhost/pluginfile.php/26769/mod_resource/content/4/Sample%20Video.mp4" type="video/mp4">
</video>

这是Firefox中的<video>标记:

<video controls="" class="vjs-tech" id="vjs_video_3_html5_api" style="position:absolute; top:0; left:0; width:100%; height:100%" autoplay=""></video>

此外,我已经看到suggestionAddType video/mp4 .mp4添加到.htaccess文件中,但我担心在Moodle中这样做。 .htaccess文件的内容是:

deny from all
AllowOverride None
Note: this file is broken intentionally, we do not want anybody to undo it in subdirectory!

编辑此内容会产生什么后果?

有没有其他建议让mp4视频能够正常使用Firefox?

0 个答案:

没有答案