动态地在html中嵌入视频

动态地在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:


  1. 扫描文件夹

  2. 寻找正确的扩展名

  3. 将视频添加到页面中

  1. Scan the folder
  2. Look for the correct extension
  3. 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>
                " );
            } 
        });
    }
});


https://*.com/a/32940532/7117409