html选择本地文件视频并播放器,使HTML5视频播放器播放不同的文件(Make a HTML5 video player play a different file)...

使HTML5视频播放器播放不同的文件(Make a HTML5 video player play a different file)

在播放视频时，我无法让HTML5播放器播放不同的视频，我尝试更改source.src但是它不会将实际视频更改为播放不同的文件。 如何让视频真正转到下一个视频？

这是代码中不起作用的部分：

使用Javascript：

function change(s){

srs=document.getElementById('source');

srs.src="";

srs.src=s;

video.pause();

video.currentTime=0;

video.play();

}

HTML：

PS：这实际上不需要在线工作，我只想为自己制作一个视频/音频播放器

While a video is playing I can't get the HTML5 player to play a different video, I tried changing the source.src but then it doesn't change the actual video to playing a different file. How do I get the video to actually go to the next video?

This is the part of the code that's not working:

Javascript:

function change(s){

srs=document.getElementById('source');

srs.src="";

srs.src=s;

video.pause();

video.currentTime=0;

video.play();

}

HTML:

PS: This doesn't actually have to work online, i just want to make a video/audio player for myself

原文：https://stackoverflow.com/questions/19635088

更新时间：2020-01-04 17:22

最满意答案

设置src属性后，调用video.load() 。

实际上，如果你只有一个单一来源(大概是因为你知道你将使用一个可以播放mp3的浏览器)，那么你可以简单地设置视频标签本身的src属性。

HTML：

使用Javascript：

var video = document.getElementById('video');

function change(s){

video.pause();

video.src = s;

video.load();

video.currentTime = 0;

video.play();

}

After you set the src property, call video.load().

Actually, if you're only going to have one single source (presumably, because you know you're going to be using a browser that will play mp3), then you can just simplify and set the src property on the video tag itself.

HTML:

Javascript:

var video = document.getElementById('video');

function change(s){

video.pause();

video.src = s;

video.load();

video.currentTime = 0;

video.play();

}

相关问答

Erick Fleck在本博客文章中的MSDN论坛中涵盖了这一点 - http://social.msdn.microsoft.com/forums/en-us/wpdevelop/thread/190abd75-3b45-4454-96ab-c32fb19c4664 。 看起来它归结为“你存储内容的地方”，所以如果你想让它成为真正的xplat，其他应用程序将不得不调整它们的结构。 或者你可以做一些“适应性的网址”。 Erick Fleck covers this pretty good at t

...

您可能想要查看videojs 。 它支持MP4等，并且具有轻量级Flash后备。 You might want to look into videojs. It supports MP4 and more, and has a lightweight Flash fallback.

我在这里你有问题的cordova文件上传插件 $ cordovaFile.readAsDataURL(路径，文件) 支持readAsDataURL函数，但Chrome中的mediatype取决于条目名称扩展名，IE中的mediatype始终为空(根据规范与text-plain相同)，Firefox中的mediatype始终为application/octet-stream 。 例如，如果内容为abcdefg，则Firefox返回data:application/octet-stream;base6

...

问题来自我使用的编码器软件。 我使用“Miro Video Converter”以webm格式转换我的mp4视频。 我尝试了另一个，它工作正常。 The problem came from the encoder software I used. I used "Miro Video Converter" to convert my mp4 video in webm format. I tried with another one and it works fine.

我现在已经工作了一段时间。 结果就是这样。 我使用了JS事件处理程序，视频元素属性和方法以及CSS元素的百分比大小规范。 请注意，目前不支持在按下自定义按钮时启动全屏。 var video=document.getElementById('robot_video')

function play(event){

video.play();

}

function replay(event){

video.currentTime=0;

} html,body{

padd

...

设置src属性后，调用video.load() 。 实际上，如果你只有一个单一来源(大概是因为你知道你将使用一个可以播放mp3的浏览器)，那么你可以简单地设置视频标签本身的src属性。 HTML：

使用Javascript

...

我弄清楚问题是什么。 虽然Internet Explorer中支持MP4，但您对文件进行编码的方式也很重要。 在为自托管的webvideo进行渲染时，请确保使用BASELINE编码。 I figured out what the problem was. Although MP4 is supported in Internet explorer it does matter how you encode the file. Make sure you use BASELINE encoding

...

看起来你只使用一个mp4文件，所以我不确定这是否有帮助，但我能够通过切换源文件的顺序来解决我的问题。 据我所知，Chrome可以播放H.264视频(这通常包含在MP4包装器中)，但它无法播放MP4文件。 我猜他们终于取消了对MP4的支持，就像他们说他们要去的那样。 这是我的代码看起来像：

...

我改编了这个解决方案 def stream(id: Long) = Action {

implicit r =>

val v = videos.where(_.id === id).single

val file = new java.io.File(v.filePath)

import ExecutionContext.Implicits.global

val fileContent: Enumerator[Array[Byte]] =

...