Как загружать видео URL-адрес динамически при использовании VideoJS?

Question

У меня есть веб-страница, которая должна загружать видео после выполнения обратного вызова на сервер для получения URL-адреса. Для тестирования я просто загружаю видео на страницу, но когда это работает, я выборочно показываю/скрываю контейнер.

Если я непосредственно вставляю URL-адрес в тег src и у вас есть data-setup = "{}", он работает нормально.

Однако, когда я пытаюсь загрузить его динамически, он не может загрузить видео (без ошибок).

Вот HTML:

<div id="video-container"> 
<video id="videoplayer" class="video-js vjs-default-skin" controls preload="auto"> 
    <source id="videosource" type='video/mp4'> 
    <p class="vjs-no-js"> 
     To view this video please enable JavaScript, and consider upgrading to a web browser that 
     <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a> 
    </p> 
</video> 

И вот код, я бегу:

$.get(url, 
     function (data) { 
      videojs("videosource", {}, function() { 
       this.reset(); 
       this.src(data); 
       this.load(); 
       this.play(); 
      }); 
     }); 

Если я не включают вызов .RESET(), то ошибки с "this.el_.load не является функцией. Если я вызываю .reset(), он не вызывает никаких ошибок, но ничего не загружается. Я запускаю Chrome, но он также не загружается в Firefox.

Я также пробовал альтернативные параметры при установке СРК с теми же результатами (нет ошибки, но нет видео либо):

this.src({ type: "video/mp4", src: data }); 

Я использую версию 5.8 с помощью CDN.

Любые идеи о том, где я ошибаюсь?

Answer 1

Перемещение комментария к ответу, когда я использовал videojs Я использовал только элемент video и использовал id. Следовательно, удаление ненужного элемента source и изменение его на videojs("videoplayer", для задания правильного элемента.