1

これを理解しようとするのはあまり運がありませんでした。

次のようなビデオを含むビデオタグがあります。

    <video id="video" preload="auto" tabindex="0" controls poster="img/layout/Untitled-1.jpg">
        <source type="video/mp4" src="video/1.mp4" >
        Sorry, your browser does not support HTML5 audio.
    </video>
    <ul id="playlist">
        <li class="active"><a href="video/1.mp4">GetFighted</a></li>
        <li><a href="video/2.mp4">ThatGirlPossessed</a></li>
        <li><a href="video/3.mp4">WhiteDevil</a></li>
    </ul>

そして、javascript と jquery を使用して、リスト項目をループしようとします (このリストは長くても短くてもかまいませんが、ユーザーによって制御されます)、それらをビデオ自体に挿入すると、これで問題なく動作します:

jQuery(document).ready(function($) {
    var video;
    var playlist;
    var tracks;
    var current;


    init();
    function init(){
        current = 0;
        video = $('video');
        playlist = $('#playlist');
        tracks = playlist.find('li a');
        len = tracks.length;
        video[0].volume = .50;
        playlist.find('a').click(function(e){
            e.preventDefault();
            link = $(this);
            current = link.parent().index();
            run(link, video[0]);
        });

        video[0].addEventListener('ended',function(e){
            $('#video').animate({opacity: 0}, 500);
            setTimeout(function(){
                current++;
                if(current == len){
                    current = 0;
                    link = playlist.find('a')[0];
                    console.log('here 1');  
                } else  {
                    link = playlist.find('a')[current];
                    console.log('here');    
                }

                $('#video').animate({opacity: 1}, 500);
                run($(link),video[0]);
            },500);
        });
    }

    function run(link, player){
            player.src = link.attr('href');
            par = link.parent();
            par.addClass('active').siblings().removeClass('active');
            video[0].load();
            video[0].play();
    }


});

(このコードは参照として別のソースから取得したものです。場所は忘れてしまいました)。しかし、私が問題を抱えているのは、ビデオが 3 つすべてをループした後にビデオを停止することです。一度。

どんな助けでも素晴らしいでしょう。

4

1 に答える 1

3

追加するだけ

video[0].addEventListener('loadstart', function(e){
  video[0].pause();
});

あなたの前に

console.log('here 1');  
于 2013-03-20T12:44:30.083 に答える