0

経過時間が経過するにつれて、連続したメッセージが表示されます。
しかし、私のコードは 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();
        });
    }
});

HTML5 ビデオ プレーヤーを使用した HTML

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

jwplayer を使用した HTML

<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>
4

1 に答える 1

1

問題は、 の場合に showCommetns メソッドを呼び出していないことです。これを行うには、オプションをjwplayer使用する必要があります - DoconTime(callbak)

試す

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

于 2013-08-21T03:57:44.970 に答える