隨着時間流逝，我如何顯示順序評論？

隨着時間的流逝，它顯示了順序消息。
但我的代碼只適用於HTML5視頻播放器。隨着時間流逝，我如何顯示順序評論？

如果我想用jwplayer做同樣的事情，我該如何解決我的javascript問題？

的JavaScript

<script type="text/javascript"> 
jQuery(document).ready(function() { 
    var comments = [{'time':'5','message':'hello! 5 secs has past'},{'time':'10','message':'hello! 10 secs has past'},{'time':'30','message':'hello! 30 secs has past'}]; 

    $('#video').on('timeupdate',function(e){ 
     showComments(this.currentTime); 
    }); 

    function showComments(time){ 
     var comments = findComments(time); 
     $.each(comments,function(i,comment){ 
      $('p').text(comment.message); 
      $('p').show().delay(5000).fadeOut(); 
     }); 
    } 

    function findComments(time){ 
     return $.grep(comments, function(item){ 
      return item.time == time.toFixed(); 
     }); 
    } 
});

HTML與HTML5視頻播放器

<video id="video" controls="controls" autoplay="autoplay" name="media"><source src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"></video>

HTML與jwplayer

<script type="text/javascript"> 
    jwplayer("myElement").setup({ 
     file: "http://media.w3.org/2010/05/sintel/trailer.mp4", 
     title: "test", 
     height: 400, 
     width: 600, 
     autostart: true, 
     autoplay: true, 
    }); 
</script>

來源

2013-08-21 MKK

訪問關閉範圍以外看起來jwplayer使用稱爲'onTime（回調）'的api方法來處理更新，同時播放.. http://www.longtailvideo.com/support/ jw-player/28851/javascript-api-reference/ – veritasetratio

@veritasetratio謝謝！爲什麼他的答案不成功？ – MKK

問題是你是不是調用showCommetns方法在jwplayer情況下，你需要使用onTime(callbak)選項來做到這一點 - Doc

嘗試

jQuery(document).ready(function() { 
    $('#video').on('timeupdate',function(e){ 
     showComments(this.currentTime); 
    }); 
}); 

var comments = [{'time':'5','message':'hello! 5 secs has past'},{'time':'10','message':'hello! 10 secs has past'},{'time':'30','message':'hello! 30 secs has past'}]; 
function showComments(time){ 
    var comments = findComments(time); 
    $.each(comments,function(i,comment){ 
     $('p').text(comment.message); 
     $('p').show().delay(5000).fadeOut(); 
    }); 
} 

function findComments(time){ 
    return $.grep(comments, function(item){ 
     return item.time == time.toFixed(); 
    }); 
} 

jwplayer("myElement").setup({ 
    file: "http://media.w3.org/2010/05/sintel/trailer.mp4", 
    title: "test", 
    height: 400, 
    width: 600, 
    autostart: true, 
    autoplay: true 
}); 

jwplayer("myElement").onTime(function(time){ 
    console.log('time:' + time) 
    showComments(Math.round(time.duration)); 
})

注：該方法showComments和依賴移動到全球範圍，因爲它需要通過jwplayer配置jwplayer配置

來源

2013-08-21 03:57:44

隨着時間流逝，我如何顯示順序評論？

回答

相關問題