Html5视频播放文件夹中的任何视频

Question

嗨我有一个本地网页，使用html5视频源在学校大厅的电视上播放视频。

每次我给一个新的视频播放时，我必须进入代码并更改视频的名称，以便在html5视频中播放。

我需要的是一些JavaScript，JQuery的& PHP将查找到本地文件夹并加载这就是曾经的视频在本地驱动器，并注入新的视频名称为HTML5视频源，因此它起着

我已经使用这个代码http://www.ampedwebstandards.com/2009/03/16/tutorial-dynamic-image-slideshow-with-php-jquery/

播放照片的幻灯片从它加载图片名称到幻灯片的本地驱动器自动这是我想要什么，但只是视频和图片不

我使用XAMPP在Windows 7电脑

我希望我能够理解我想做什么，并感谢您给予的任何帮助。

Answer 1

那么，我不打算为你写整个幻灯片。但是，下面是如何在文件夹中将电影列为链接并在点击它们时将它们添加到视频源属性的示例。在这个例子中，我们假设我们将所有的脚本添加到同一个文件中。

此脚本

要求的工作：

• jQuery的
• PHP

HTML

把你的身体标记之间按照您的index.php

<!-- this is your video element --> 
<video width="400" controls> 
    <!-- your video source, verify so that type is accurate --> 
    <source id="vidsrc" src="myvideo.mp4" type="video/mp4"> 
</video> 

PHP

把下面的脚本某处你的身体标记之间的index.php文件

<?php 
//fetch and list all the files found in the video folder. Make sure to change the path to your video folder. 
foreach(glob('path-to-your-video-folder/*') as $video){ 
    echo '- <a href="#" class="isVideo" data-video="'.$video.'">'.$video.'</a><br/>'; 
    } 
?> 

jQuery的

把下面的脚本的底部，你的身体结束标记之前。

<script type="text/javascript"> 
//jQuery code that will trigger when you click on one of the links displayed by the PHP script 
$('.isVideo').on('click',function(){ 
    //this will change the video source to the chosen video 
    $('#vidsrc').attr('src',$(this).data('video')); 
    return false; 
    }); 
</script>