CODEWITHSUNDEEP
javascriptjqueryhtml5-video
user1982011
user1982011

Reputation: 307

Replace Video track src with variable

I have the following variable called url which is equal to the below blob which is a vtt file

url = "blob:https%3A/d1d7b857-3364-4a21-868c-f4a9580c5e2c...."

and the following video page

<video id="gump" width="320" height="240" controls>
  <source src="forrest_gump.mp4" type="video/mp4">
  <track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
</video>

I would like to replace the subtitle track src with the above url using JS or Jquery. I was wondering what the best way to do this is.

Something I was thinking was document.getElementById("gump").src = url but doesnt seem to work as i need to get the track src

Upvotes: 1

Views: 2068

Answers (2)

Musa
Musa

Reputation: 97672

Since the <track> element src attribute takes the url of the vtt file, just set it to that

$('#gump track').prop('src', url);

Upvotes: 1

TGH
TGH

Reputation: 39248

<video id="gump" width="320" height="240" controls>
  <source id='mySource' src="forrest_gump.mp4" type="video/mp4">
  <track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
</video>

document.getElementById("mySource").src = url

Put an id on the actual source element and target it.

Upvotes: 1

Related Questions