Как сделать смену видео по нажатию на кнопки

Можете скинуть код js в котором при нажатие на кнопку меняется видео. Допустим: ты заходишь на сайт и у тебя там стоит первая серия но рядом есть кнопки с сериями, по типу "1 серия", "2 серия" и т.д. И по нажатию на кнопку со 2 серией включается 2 эпизод, при нажатие на кнопку " 3 серия" включается 3 эпизод.


Ответы (1 шт):

Автор решения: Senje

вот Вам пример того, как это можно сделать.

var videos = [
  "1.mp4",
  "2.mp4",
  "3.mp4",
  "4.mp4",
];

function videoChange(id) {

  var video = document.getElementById("video");
  var source = document.getElementById("source");

  source.src = videos[id];
  video.appendChild(source);

  video.load();
  video.pause();
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="script.js"></script>
  <link rel="stylesheet" href="style.css">
</head>

<body>
  <div>
    <video width="400" height="300" controls="controls" id="video">
            <source src="1.mp4" id="source">
        </video>
  </div>
  <input type="button" onclick="videoChange(0)" value="1">
  <input type="button" onclick="videoChange(1)" value="2">
  <input type="button" onclick="videoChange(2)" value="3">
  <input type="button" onclick="videoChange(3)" value="4">
</body>

</html>

→ Ссылка