javascript - 当前时间和开始时间(source 标签中的 startat 属性)匹配时，如何播放视频？

Question

在这里，我成功检索到开始时间(源标记中的 startat 属性)大于当前时间的视频。但是时间到了无法播放视频

HTML

<video id="media-video" width="600" height="300" src="http://localhost/CastingGallery/upload/2/php.mp4">        
<source class="" src="http://localhost/CastingGallery/upload/2/marimatrubhasha.mp4" id="videosource" type="video/mp4" startat="00:00:00" endat="00:04:07" name="Gujarati Bhasha" description="This is Gujarati Video">                  
<source class="active" src="http://localhost/CastingGallery/upload/2/php.mp4" id="videosource" type="video/mp4" startat="00:04:07" endat="00:19:06" name="PHP Video" description="This is PHP Video">                   
<source class="active" src="http://localhost/CastingGallery/upload/2/php.mp4" id="videosource" type="video/mp4" startat="00:19:06" endat="00:34:05" name="PHP Video" description="This is PHP Video">                   
<source class="active" src="http://localhost/CastingGallery/upload/2/php.mp4" id="videosource" type="video/mp4" startat="00:34:05" endat="00:49:04" name="PHP Video" description="This is PHP Video">           
</video>

Java脚本

$(document).ready(function(){
    var mediaPlayer = document.getElementById('media-video');
    var videosource=document.getElementById('source');
    var Startvideo = mediaPlayer.querySelectorAll('source[startat]'); 
    var d=new Date();       
    var hh=d.getHours();        
    var mm=d.getMinutes();      
    var ss=d.getSeconds();
    var timeString = ((hh < 12) ? ":0" : "") + hh;
    timeString  += ((mm < 10) ? ":0" : ":") + mm;
    timeString  += ((ss < 10) ? ":0" : ":") + ss;
    var currentTime=timeString;
    var getStartTime = document.getElementById('videosource').getAttribute('startat');      
    Array.prototype.forEach.call(Startvideo, function(elem) {
    var getStartTime = elem.getAttribute('startat');
    console.log('start time is '+ getStartTime )
    if (getStartTime >= currentTime) {
      var c=elem.getAttribute('src');                   
        mediaPlayer.src=c  
        var currentTimeSecond=currentTime.split(':');
        var getStartTimeSecond=getStartTime.split(':');
        var TimeSecondsCurrent = (+currentTimeSecond[0]) * 60 * 60 + (+currentTimeSecond[1]) * 60 + (+currentTimeSecond[2]);            
        var TimeSecondsGetStart= (+getStartTimeSecond[0]) * 60 * 60 + (+getStartTimeSecond[1]) * 60 + (+getStartTimeSecond[2]);     
      for (var i=TimeSecondsCurrent; i <= TimeSecondsGetStart; i++ ){           
        if(TimeSecondsGetStart == TimeSecondsCurrent){              
            mediaPlayer.play(); 
        }
      }
    }
  });

}); 

Answer 1

$(document).ready(function(){
var mediaPlayer = document.getElementById('media-video');
var videosource=document.getElementById('source');
var Startvideo = mediaPlayer.querySelectorAll('source[startat]'); 
var d=new Date();       
var hh=d.getHours();        
var mm=d.getMinutes();      
var ss=d.getSeconds();
var timeString = ((hh < 12) ? ":0" : "") + hh;
timeString  += ((mm < 10) ? ":0" : ":") + mm;
timeString  += ((ss < 10) ? ":0" : ":") + ss;
var currentTime=timeString;
var getStartTime = document.getElementById('videosource').getAttribute('startat');      
Array.prototype.forEach.call(Startvideo, function(elem) {
var getStartTime = elem.getAttribute('startat');
console.log('start time is '+ getStartTime )
if (getStartTime >= currentTime) {
  var c=elem.getAttribute('src');
    var currentTimeSecond=currentTime.split(':');
    var getStartTimeSecond=getStartTime.split(':');
    var TimeSecondsCurrent = (+currentTimeSecond[0]) * 60 * 60 + (+currentTimeSecond[1]) * 60 + (+currentTimeSecond[2]);            
    var TimeSecondsGetStart= (+getStartTimeSecond[0]) * 60 * 60 + (+getStartTimeSecond[1]) * 60 + (+getStartTimeSecond[2]);     
    var totalSeconds= TimeSecondsGetStart - TimeSecondsCurrent;
        var totalmiliseconds = totalSeconds * 1000;
        console.log(totalmiliseconds);
        setTimeout(myfunction,totalmiliseconds);
        function myfunction(){          
        var c=elem.getAttribute('src');
        console.log(c);
        mediaPlayer.src=c;                      
        mediaPlayer.play(); 
        }     
}
  });
});