Question

“currentSrc” is the only option I have to switch source src in html5 video in with multiple source (*.mp3, *.ogg etc.)

“currentSrc” throws “undefined” if I use inside Jquery.
But it works fine, if I call this in the html page.

In detail:
My Video Source:

<video width="630" height="354" id="video1" class="video1" poster="asserts/poster.png" controls="controls" data-name="demo video" data-uid="57fb2708">
        <source src="http://static.clipcanvas.com/sample/clipcanvas_14348_H264_320x180.mp4" data-quality="sd" />
        <source src="asserts/samllfile.mp4" data-quality="hd" />
        <source src="http://static.clipcanvas.com/elephants-dream.webm" data-quality="hd" />
        <source src="http://video.webmfiles.org/big-buck-bunny_trailer.webm" data-quality="sd"/>
        <source src="http://video.webmfiles.org/elephants-dream.webm" data-quality="hd" />
</video>

Get current video URL

Javascript in the html page (which works fine):

myVid=document.getElementById("video1");
    function getVid(){
        alert(myVid.currentSrc);
    };

Line inside Jquery (throws “undefined”):

alert($hdVideo.currentSrc);

Please help me out…

Answer 1

Because a jQuery object does not have a property currentSrc so it returns undefined.

alert( $hdVideo.get(0).currentSrc );
alert( $hdVideo[0].currentSrc );
alert( $hdVideo.prop("currentSrc") );   //might be attr() instead of prop()