Javascript 视频结束后如何启用按钮。？

我有一个包含视频和按钮的页面，但我不希望用户能够在视频结束之前单击finish

视频代码：

<video width="100%" height="480" controls>
    <source src="video/lesson4.mp4" type="video/mp4">
    Your browser does not support the video tag.
</video>

您的浏览器不支持视频标记。

完成按钮的代码：

<form method="POST" action="week.php">
    <div class="input-group">
        <button type="submit" class="btn" id="btn" name="register_btn" disabled="disabled"><h6>FINISH</h6></button>
    </div>
</form>

完成

您应该收听“结束”事件，如下所示：

var video = document.getElementById("myVideo");
var button = document.getElementById("myButton")
video.addEventListener("ended", function() {
   button.disabled = false;
}, true);

请参见媒体活动，您可以执行以下操作：

JavaScript

var element = document.getElementById('video_id');

element.onended = function() {
     document.getElementById('btn').disabled = false;
};

jQuery

$("video").on("ended", function (e) {
    $('#btn').prop('disabled', false);
});

您可以将其用于播放和暂停事件

---

有关更多事件，请参阅：

您可以添加事件侦听器 像这样：

<video width="100%" height="480" controls>
<source src="video/lesson4.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

<form method="POST" action="week.php">
<div class="input-group">
<button type="submit" class="btn" id="btn" name="register_btn"  class=“enableIfFinish”
disabled="disabled"><h6>FINISH</h6></button>
</div>

<script type='text/javascript'>
    document.getElementById('myVideo').addEventListener('ended',myHandler,false);
    function myHandler(e) {
        $(‘.enableIfFinished’).prop(‘disabled’,false);
    }
</script>

您的浏览器不支持视频标记。
完成
document.getElementById（'myVideo'）.addEventListener（'ended'，myHandler，false）；
函数myHandler（e）{
$（'.enableFinished'）.prop（'disabled'，false）；
}

---

不要忘记包括jquery库

以下是工作示例

document.getElementById（'someID'）。addEventListener（'End'，videoEndHandler，false）；
函数videoEndHandler（e）{
document.getElementById（“myBtn”）.disabled=false；
}

您的浏览器不支持视频标记。
完成