success change source & track of video use onclick button, but the video still same

Question

Before i start, i\'m sorry if i belong is repost. But, i still not get the answer after check the previous thread.

i try to change source of video with onclick butto

Answer 1

When you change the src of the <source> element, it doesn't change the src of the <video> element. You have to call its load method :

function myFunction1() {
  document.getElementById("myVideo").src = "http://media.w3.org/2010/05/bunny/movie.mp4";
//  document.getElementById("mySubtitle").src = "/Subtitle2.srt";
  document.querySelector('video').load();
}

<button onclick="myFunction1()">Change Video 1</button>

<video width="560" height="320" controls="controls" preload="none">
  <source id="myVideo" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4">
  <!--<track id="mySubtitle" src="/Subtitle1.srt" kind="subtitles" srclang="id" label="Indonesian" default>-->
</video>

Answer 2

Try this:

<script>
function myFunction1() {
 document.getElementById("myVideo").setAttribute("src", "/video2.mp4");//Set src attribute
 document.getElementById("mySubtitle").setAttribute("src", "/Subtitle2.srt");//Here too
}
function myFunction2() {
 document.getElementById("myVideo").setAttribute("src", "/video3.mp4");//And here
 document.getElementById("mySubtitle").setAttribute("src", "/Subtitle3.srt");//Same
}
</script>

This should work perfectly.