html5-video事件timeupdate在chrome浏览器上触发两次.
重现步骤:
<!DOCTYPE html>
<html lang="en">
<head>
<script
src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
crossorigin="anonymous"></script>
</head>
<body>
<video id="video">
<source src=http://techslides.com/demos/sample-videos/small.mp4 type=video/mp4>
</video>
<button id="button">Update time</button>
<script>
$( document ).ready(function() {
var vid = document.getElementById("video")
vid.addEventListener("timeupdate", timeUpdate, false);
$("#button").on("click", buttonClick);
function timeUpdate(e){
console.log("timeUpdate");
}
function buttonClick(e){
console.log("buttonClick");
vid.currentTime = 1;
}
});
</script>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
有任何想法吗 ?))
javascript video google-chrome javascript-events html5-video