Используйте переменную как src в теге video - используйте URL документа для создания переменной имени файла - PullRequest
0 голосов
/ 20 февраля 2019

Я пытаюсь использовать переменную (основанную на параметре, переданном вместе с URL-адресом документа) для воспроизведения видео с помощью тега видео HTML5.

У меня есть страница HTML5, в которой перечисляется множество процедур.Я создал видео в формате .mp4 для каждой из процедур, которые находятся в каталоге ниже уровня исходной HTML-страницы.Это все предназначено для запуска на CD или жестком диске;Интернет или какой-либо другой тип сервера не используется.

В настоящее время я использую параметр href тега <a>, чтобы напрямую открывать видео.Это работает, но я подумал, что было бы лучше открыть вторую страницу HTML5, на которой есть встроенное видео, так как она теперь является родной для HTML5.

Я подумал, что буду использовать одну HTML-страницу для воспроизведения видео с названием видео, отправляемого с первой HTML-страницы в зависимости от выбора пользователя: HTML-страница 1 - процедура кликов пользователя - открыть вторую HTML-страницус параметром в конце URL.На второй HTML-странице проанализируйте URL-адрес, чтобы получить имя видео, используйте эту переменную в качестве 'src' в теге video:

<video controls >
    <source src=v+".mp4" >
    Sorry, your browser doesn't support embedded videos.
</video>

, но это не работает.Кажется, он не понимает переменную.Я пытался создать переменную несколькими способами.

Вместо этого мое решение состоит в том, чтобы создать страницу HTML для каждого конкретного файла .mp4 и жестко закодировать имя файла видео на каждой отдельной странице HTML.Должен быть более легкий путь.У вас есть какие-нибудь предложения?

У меня есть только базовые знания HTML / CSS / JavaScript.

1 Ответ

0 голосов
/ 21 февраля 2019

вам нужно будет использовать Javascript, чтобы (а) найти переменную из URL-адреса и (б) записать ее в документ при его отображении.

приведенный ниже пример содержит некоторый код для захвата параметра,а затем использует эту функцию для получения параметра с именем v и, если он существует, использует его для записи тега <video>:

<html>
<body>

<script>
// split the querystring parameters on the URL and find the requested one
function getParam(parameterName) {
    var result = null, tmp = [];
    var items = location.search.substr(1).split("&");
    for (var index = 0; index < items.length; index++) {
        tmp = items[index].split("=");
        if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
    }
    return result;
}

v = getParam("v")
if (v===null) {
    document.write("<p>You need to add a ?v={filename} to the url")
} else {
    document.write("<video controls>")
    document.write("<source src=\""+v+".mp4\" >")
    document.write("Sorry, your browser doesn't support embedded videos.")
    document.write("</video>")
}
</script>

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...