如何在观看视频中弹出问题？问答播放器/视频弹题

最新推荐文章于 2025-09-09 11:15:58 发布

原创最新推荐文章于 2025-09-09 11:15:58 发布 · 958 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#音视频 #教育问答 #播放器问答 #视频问答

视频技术同时被 3 个专栏收录

60 篇文章

订阅专栏

视频安全

51 篇文章

订阅专栏

保利威教育

20 篇文章

订阅专栏

该文章已生成可运行项目，

如何在观看视频中弹出问题？问答播放器/视频弹题

视频问答播放器是一种互动教学工具，通过在视频特定时间点弹出问题卡片，强制学员答题后才能继续观看。主要功能包括：1）设置答题时间点，回答错误会回退视频重新学习；2）防止学员挂机，确保学习专注度；3）支持自定义问题内容和答题逻辑。技术实现上可通过JavaScript调用播放器API，设置问题参数和答题回调函数，实现答题正确继续播放、错误重学的互动效果。该功能适用于在线教育场景，能有效强化学习要点，提升教学效果。

以下是该功能的一些主要特点：
01.与培训视频内容的互动性：
视频播放到特定时间点时，会弹出问题卡片，学员必须正确回答问题后才能继续观看视频；回答错误，则向前返回一小段视频，重新观看。
02.学员离线防挂机：
通过强制学员回答问题，有效避免学员挂机现象，确保学员积极认真的参与学习。

代码调用示例

问答播放器。

<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'
  });

player.on('s2j_onPlayerInitOver',
function(e) {
    var question1 = [{
        "examId": "1699e49ffeb",
        "question": "第1个问题:1 x 2 = ?",
        "choices": [{
            "answer": "1"
        },
        {
            "answer": "2",
            "right_answer": 1
        },
        {
            "answer": "3"
        },
        {
            "answer": "4"
        }],
        "answer": "",
        "wrongAnswer": "",
        "skip": true,
        "wrongTime": 5,
        "showTime": 10
    }];
    player.sendQuestion(question1);
});
window.onQuestionSkip = function(data, vid) {
    console.log('onQuestionSkip', data, vid);
}
window.onQuestionPopUp = function(data, vid) {
    console.log('onQuestionPopUp', data, vid);
}
window.onAnswerResult = function(isRight, data, msg, seekTime, vid) {
    console.log('onAnswerResult',isRight, data, msg, seekTime, vid);
    if (!isRight) {
        var question2 = [{
            "examId": "1699e49ffef",
            "question": "第2个问题:2 x 2 = ?",
            "choices": [{
                "answer": "1"
            },
            {
                "answer": "2"
            },
            {
                "answer": "3"
            },
            {
                "answer": "4",
                "right_answer": 1
            }],
            "answer": "",
            "wrongAnswer": "",
            "skip": true,
            "wrongTime": 5,
            "showTime": 10
        }];
        player.changeQuestion(10, question2);
    }
}
</script>