教育场景下禁用html5播放器拖动进度条的例子

阿酷tony

于 2025-08-21 18:41:24 发布

阅读量392

点赞数 3

CC 4.0 BY-SA版权

分类专栏：在线教育培训保利威视频技术视频应用专栏文章标签： html5 前端 html 在线教育场景禁止播放器拖动

本文链接：https://blog.csdn.net/ffffffff8/article/details/150589119

视频应用专栏同时被 3 个专栏收录

93 篇文章

订阅专栏

保利威视频技术

9 篇文章

订阅专栏

在线教育培训

8 篇文章

订阅专栏

禁用视频课程进度条的拖动功能，主要是为了强制学员按照课程设计的顺序观看内容，防止跳过关键知识点，从而保证学习效果和课程的完整性。

1.防止应试作弊：
在一些需要观看视频才能解锁下一章节或完成测试的场景中，禁用拖动能确保学员真正观看了教学内容，而不是仅仅为了完成任务而快进。

2.强制观看基础知识：
对于那些知识点层层递进的课程（例如编程、数学等），禁用拖动能确保学员从最基础的概念开始学习，避免跳过前提知识导致后续学习困难。

代码例子：完全禁止拖动视频播放器进度条。

<div id="player"></div>
<script src="//player.polyv.net/resp/vod-player/latest/player.js"></script>
<script>
  var player = polyvPlayer({
  wrap: '#player',
  width: 800,
  height: 533,
  ban_seek:'on', //禁止拖动视频进度条(on,off)
  //ban_seek_by_limit_time:'on', //是否禁止视频拖拽未播放区域(on,off)
  vid: '88083abbf5bcf1356e05d39666be527a_8', 
  playsafe:'81814fed-bdd0-4506-bec1-ebc8093148c5-hfevwsfxcsbcocx', 
  //playsafeUrl:'https://myDomain.com/token', 
  ts:'1568131545000',
  sign:'88313661ba7ded642c7b557b0a364b4b'
  });
</script>

代码例子：禁止拖动视频播放器"未播放区域"的进度条(已播放过区域的进度条可以拖动)。

<div id="player"></div>
<script src="//player.polyv.net/resp/vod-player/latest/player.js"></script>
<script>
  var player = polyvPlayer({
  wrap: '#player',
  width: 800,
  height: 533,
  //ban_seek:'on', //禁止拖动视频进度条(on,off)
  ban_seek_by_limit_time:'on', //是否禁止视频拖拽未播放区域(on,off)
  vid: '88083abbf5bcf1356e05d39666be527a_8', 
  playsafe:'81814fed-bdd0-4506-bec1-ebc8093148c5-hfevwsfxcsbcocx', 
  //playsafeUrl:'https://myDomain.com/token', 
  ts:'1568131545000',
  sign:'88313661ba7ded642c7b557b0a364b4b'
  });
</script>

以下为禁止拖动视频播放器进度条的截图：

禁用拖动视频进度条