通过Jquery更改html5中的视频(不同质量)文件

时间:2012-08-25 12:16:53

标签: javascript jquery html5 html5-video

Moto:当用户点击按钮时,通过Jquery更改播放视频。 示例网站:http://sublimevideo.net(点击播放器控件中的“高清”按钮)

详细说明:

在页面加载时,浏览器将播放源中给出的第一个视频(网址:“The-Dark.mp4”)。我想要的是,当用户点击高清按钮(控制)时,浏览器应播放下一个(网址:“The-Dark-hd.mp4”)

我的HTML代码:

        <source src="asserts/The-Dark.mp4" type="video/mp4;" data-quality="sd"></source>            
        <source src="asserts/The-Dark-hd.mp4" type="video/mp4;" codecs="&quot;avc1.42E01E, mp4a.40.2&quot;" data-quality="hd"></source>

        <source src="asserts/The-Dark.ogg" type="video/ogg;" codecs="&quot;theora, vorbis&quot;"></source>

        <source src="asserts/The-Dark-hd.ogg" type="video/ogg;" codecs="&quot;theora, vorbis&quot;"></source>
</video>

请让我知道我需要关注的Jquery

1 个答案:

答案 0 :(得分:9)

$('source', 'video')​​.eq(1).prependTo('video');
$('video')[0].load();
$('video')[0].play();

FIDDLE