Question

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

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

我需要的是一些JavaScript，JQuery和amp; PHP将查看本地文件夹并加载本地驱动器中的视频并将新视频名称注入html5视频源以便播放

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

播放来自本地驱动器的图片幻灯片，它将图片名称自动加载到幻灯片中这是我想要的，但只是视频而不是图片

我在Windows 7上使用XAMPP

我希望我对自己想做的事情有所了解，并感谢你给予的任何帮助。

Answer 1

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

此脚本的要求：

jquery的
PHP

HTML

将以下内容放在index.php

中的body标签之间

<!-- 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文件

中的body标记之间

<?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>

Answer 2

如果您不想更改文件名，则可以随意选择播放文件夹中的所有mp4文件，否则，如果文件夹中只有一个mp4文件，它将仅拾取一个。

<?php
$myVideoDir = '.';
$extension = 'mp4';
$videoFile = false;
$pseudoDir = scandir($myVideoDir);
$myitems = array();
$mycounter = 0;
foreach($pseudoDir as $item) {
    if ( $item != '..' && $item != '.' && !is_dir($item) ) {
        $ext = preg_replace('#^.*\.([a-zA-Z0-9]+)$#', '$1', $item);
        if ( $ext == $extension )
            $videoFile = $item;
            if ( $videoFile <> "" ) {
                $myitems[] = $videoFile;
                $mycounter = $mycounter + 1;
            }               
    }
}

$myrandom = rand(0,$mycounter-1);
if ( !!$videoFile ) {

    echo '<video id="dep" class="center" width="400" autoplay controls>        
            <source src="'.$myVideoDir.'/'.$myitems[$myrandom].'" type="video/mp4"> 
        </video>
    ';
}
?>

对Play video from Folder

的改进

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

2 个答案: