我正在使用 html 嵌入标签来运行我的视频。但是我在获取事件时遇到问题,我想在触发播放或暂停事件时调用一个函数。 我还希望在单击播放按钮时播放视频。
我需要你的帮助:
我的代码如下 -
<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="modal-box">
<div class="modal-box-content">
<embed id="video1" src="http://player.vimeo.com/video/76979871" width="600" height="600" frameborder="0"></embed>
</div>
</div>
<button id="playButton" style="width: 80px" >Play</button>
<div >Elapsed Time: <span id="timeDisplay"></span></div>
<!-- Button width set so overall size doesn't change when we toggle the label -->
<script>
var oVideo = document.getElementById("video1"); //video element
var button = document.getElementById("playButton");
var display = document.getElementById("timeDisplay");
// Capture time changes and display current position
oVideo.addEventListener("timeupdate", function () {
display.innerText = oVideo.currentTime.toFixed(2) ;
}, false);
button.addEventListener("click", function () {
// toggle between play and pause based on the paused property
if (oVideo.paused) {
var oInput = document.getElementById('videoFile'); //text box
if (oInput.value) {
// only load a video file when the text field changes
if (oInput.value != oVideo.src) {
oVideo.src = oInput.value;
oVideo.load();
}
oVideo.playVideo();
}
} else {
oVideo.pauseVideo();
}
}, false);
// Capture the play event and set the button to say pause
oVideo.addEventListener("onplay", function () {
button.innerHTML = "Pause";
}, false);
// Capture the pause event and set the button to say play
oVideo.addEventListener("onpause", function () {
button.innerHTML = "Play";
}, false);
</script>
</body>
</html>
最佳答案
您的代码无法运行的问题是因为您试图在嵌入式视频上调用 DOM 函数,而这将无法运行。
幸运的是,这可以通过此处找到的一个不错的插件来完成:Vimeo-jQuery-API
只需确保您使用 Vimeo iframe 嵌入并根据您的需要查找有关 API 事件的部分。请注意,这仅适用于嵌入式 Vimeo 视频。
在 Jquery 之后包含插件代码,然后您可以在 iframe id 上绑定(bind)事件监听器:
$("#myvideo").on("play", function(){
alert('Playing!');
});
$("#myvideo").on("pause", function(){
alert('Pausing!');
});
工作 JSfiddle:https://jsfiddle.net/vvemqpvg/1/
关于javascript - html 嵌入标签视频事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29227429/