html5 媒体标签随着播放列表中媒体类型的变化而变化

Question

我需要使用 HTML5 媒体标签从本地计算机创建所选媒体（音频和视频）的播放列表。我正在使用下面的代码

http://jonhall.info/how_to/create_a_playlist_for_html5_audio

现在面临的问题出在这一行
extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : '';

如果我将其更改为视频/mp4，它只会播放音频文件，它只会在我使用 if else 时播放视频文件，那么第一个条件也有效

                if(audio.canPlayType('video/mp4')) {
                extension = '.mp4';
                }
                else if
                (audio.canPlayType('audio/mpeg')) {
            extension = '.mp3';
            }

请帮我看看我可以在这里播放播放列表中两种类型的媒体的条件是什么，如果可能的话，我可以使用所选媒体类型切换视频/音频标签。

提前致谢

Answer 1

要在播放列表中同时使用视频和音频，您应该使用 html5 视频标签而不是音频标签。您无需来回切换。 video 标签将同时播放音频和视频文件。

为了使用所列网站的代码，您需要知道您是在加载视频文件还是音频文件。然后，您可以根据脚本中的浏览器支持来确定要使用的正确扩展。请参阅下面的新 html5 视频和音频播放列表示例：

http://jonhall.info/examples/html5_video_audio_playlist_example.html

在新示例中我替换了代码：

extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : '';

有一个功能：

getExtension = function(type) {
    extension = '';
    if(type === 'a') {
        if(video.canPlayType('audio/mpeg')) {
            extension = '.mp3';
        }
        if(video.canPlayType('audio/ogg')) {
            extension = '.ogg';
        }
    }
    if(type === 'v') {
        if(video.canPlayType('video/mp4')) {
            extension = '.mp4';
        }
        if(video.canPlayType('video/ogg')) {
            extension = '.ogv';
        }
    }
    return extension;
};

将字母 'a' 传递给音频，将字母 'v' 传递给视频。