How do you change the src of a HTML5 video tag using jQuery?
I got this HTML:
<div id="divVideo"> <video controls> <source src="test1.mp4" type="video/mp4" /> </video> </div>
This doesn't work:
var videoFile = 'test2.mp4'; $('#divVideo video source').attr('src', videoFile);
It changes the src if I inspect it using firebug, but does not actually change the video being played.
I read about .pause() and .load(), but I'm not sure how to use them.
click(function () { $("#divVideo video"). attr({ "src": $(this). data("item"), "autoplay": "autoplay", }) }) }, 2000); } }); here ". imgthumbnew" is the class of images which are thumbs of videos, an extra attribute is given to them which have video url.
To change source on HTML5 video tag with JavaScript, we an set the src property of the video element. const changeSource = (url) => { const video = document. getElementById("video"); video. src = url; video.
Answer: Use the jQuery attr() Method You can use the attr() method to change the image source (i.e. the src attribute of the <img> tag) in jQuery. The following example will change the image src when you clicks on the image.
The src attribute specifies the location (URL) of the video file.
Try $("#divVideo video")[0].load();
after you changed the src attribute.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With