JavaScriptでontimeupdateを使用する方法


  1. ontimeupdateイベントをHTML要素に追加する方法:
<video id="myVideo" ontimeupdate="myFunction()">
  <source src="video.mp4" type="video/mp4">
</video>
  1. JavaScript関数を作成し、ontimeupdateイベントハンドラとして使用する方法:
function myFunction() {
  var video = document.getElementById("myVideo");
  var currentTime = video.currentTime;
  // 現在の再生位置に基づいたアクションを実行するコードを追加する
  console.log("現在の再生位置: " + currentTime);
}
  1. addEventListenerメソッドを使用してontimeupdateイベントを追加する方法:
var video = document.getElementById("myVideo");
video.addEventListener("timeupdate", myFunction);
function myFunction() {
  var currentTime = video.currentTime;
  // 現在の再生位置に基づいたアクションを実行するコードを追加する
  console.log("現在の再生位置: " + currentTime);
}

これらのコード例では、ビデオ要素の再生位置が変更されるたびに、myFunction関数が呼び出されます。myFunction内で、現在の再生位置に基づいたアクションを実行するコードを追加することができます。

このようにontimeupdateを使用すると、ビデオやオーディオの再生位置に応じて動的なアクションを実行することができます。