成功改变来源&跟踪视频使用onclick按钮，但视频仍然相同 [英] success change source & track of video use onclick button, but the video still same

问题描述

在我开始之前，我很抱歉，如果我属于重新发布。但是，在检查上一个帖子后我仍然没有得到答案。

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

我尝试用onclick按钮更改视频源。但是，虽然来源已经改变，但视频仍然相同。

i try to change source of video with onclick button. But, the video still same although the source has changed.

<video width="560" height="320" controls="controls" preload="none">
  <source id="myVideo" src="/video1.mp4" type="video/mp4">
  <track id="mySubtitle" src="/Subtitle1.srt" kind="subtitles" srclang="id" label="Indonesian" default>
</video>

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

<script>
function myFunction1() {
document.getElementById("myVideo").src = "/video2.mp4";
document.getElementById("mySubtitle").src = "/Subtitle2.srt";
}
function myFunction2() {
document.getElementById("myVideo").src = "/video3.mp4";
document.getElementById("mySubtitle").src = "/Subtitle3.srt";
}
</script>

源已成功更改，但视频仍然相同。

任何人都有想法？

The source has success changed, but video still same.
Anyone have an idea?

推荐答案

当您更改<$ c的 src 时$ c>< source> 元素，它不会更改< video> 元素的src。你必须调用它的加载方法：

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>

这篇关于成功改变来源&amp;跟踪视频使用onclick按钮，但视频仍然相同的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！