Как запустить завершенное событие с помощью проигрывателя videojs на мобильном телефоне

Question

Я пытаюсь показать предупреждение на устройстве Android после того, как видео закончит проигрывание в проигрывателе videojs html5. Я использую javascript ниже конца моего тега видео, и я не могу понять, почему он не показывает предупреждение.

HTML для видеоплеера

<video id="my-video" class="video-js" autoplay preload="auto" width="640" height="360" data-setup="{}"> 

     <!--poster="MY_VIDEO_POSTER.jpg"--> 
      <!--Gets where video is locally stored and plays it--> 
      <source ng-src="{{getFilePath()}}" type='video/mp4'> 
      <!--<source src="MY_VIDEO.webm" type='video/webm'>--> 
      <!--If there is no javascript for some reason--> 
      <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> 

Javascript здесь

<script type="text/javascript"> 
    var myPlayer = videojs("my-video"); 
    videojs("my-video").ready(function() { 
     myPlayer.on("ended", function() { 
     alert('The video has ended'); 
    }); 
}); 
</script> 

Если кто-то может показать мне, пожалуйста, почему это не работает, и как это исправить, я бы с удовольствием оценит. Также в качестве примечания, если кто-либо знает, как отключить полосу прокрутки, не отключая все элементы управления, которые также были бы фантастическими.

Спасибо

Answer 1

Попробуйте это:

<script type="text/javascript"> 
    var myPlayer = videojs("my-video",{},function(){ 
     // the third parameter is the ready event on the constructor 
     this.on("ended",function(){alert('The video has ended');}); 
    }); 
</script> 

или это:

<script type="text/javascript"> 
    var myPlayer = videojs("my-video"); 
    // myPlayer object is defined, so It is ready to listen events 
    myPlayer.on("ready",function(){ 
     alert('The player is ready'); 
    }); 
    myPlayer.on("ended",function(){ 
     alert('The video has ended'); 
    }); 
</script> 

или попробовать использовать HTML5:

<script type="text/javascript"> 
    var myPlayer = videojs("my-video"); 
    // We will use getElementsByTagName, because videojs can wrap 
    // your video inside a div, and changes its id. Your id will 
    // be the videojs div wrapper. 
    // Get the first video element found and append the listener 
    var html5_video = document.getElementsByTagName("video")[0]; 
    html5_video.addEventListener('ended', function(e) { 
     alert('The video has ended'); 
    }); 
</script> 

Videojs api предоставляет следующие события: завершенные, ошибки, загруженные данные, загруженные метаданные, timeupdate, useractive, userinactive и volumechange.

Но есть и другие, которые поддерживаются стандартной html5 видео тэга как воспроизведение, пауза и т.д.

Счастливого код :-)