动态地在html中嵌入视频
问题描述:
我希望能够将源视频动态地嵌入到html页面中。例如,如果我想添加一个新视频到我的页面,我只需将它放在一个文件夹中,并将其自动嵌入到我的html页面中。我想(如果可能)使用JavaScript和jQuery来做到这一点。有人能指引我朝着正确的方向吗?
I would like to be able to dynamically embed videos from a source into an html page. For example, if I wanted to add a new video to my page I would simply just have to place it in a folder and have it automatically be embedded in my html page. I would like (if possible) to do this using JavaScript and jQuery. Can someone point me in the right direction?
答
必须这样做:
It has to be done like this:
- 扫描文件夹
- 寻找正确的扩展名
-
将视频添加到页面中
- Scan the folder
- Look for the correct extension
Append videos to the page
var folder = "videos/";
$.ajax({
url : folder,
success: function (data) {
$(data).find("a").attr("href", function (i, val) {
if( val.match(/\.(mp4)$/) ) {
$("body").append( "
<video width="320" height="240" autoplay>
<source src='"+ folder + val +"' type="video/mp4">
</video>
" );
}
});
}
});