1

我已经下载了 Jplayer 并在网站上使用了 Jplayer 视频播放列表。现在我使用一些 div 作为拇指。关键是我无法通过拇指点击播放视频。例如。如果我单击 thumb1 id，则应播放第一个视频，如果单击第二个视频，则应播放第二个视频。这是我的播放列表代码。

//<![CDATA[
$(document).ready(function () {
    var currentpath = "";
    new jPlayerPlaylist({
            jPlayer: "#jquery_jplayer_1",
            cssSelectorAncestor: "#jp_container_1"
        }, [
            {
                title: "Big Buck Bunny Trailer",
                artist: "Blender Foundation",
                free: true,
                m4v: "http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Big_Buck_Bunny_Trailer.ogv",
                webmv: "http://www.jplayer.org/video/webm/Big_Buck_Bunny_Trailer.webm",
                poster: "http://www.jplayer.org/video/poster/Big_Buck_Bunny_Trailer_480x270.png"
            },
            {
                title: "Finding Nemo Teaser",
                artist: "Pixar",
                m4v: "http://www.jplayer.org/video/m4v/Finding_Nemo_Teaser.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Finding_Nemo_Teaser.ogv",
                webmv: "http://www.jplayer.org/video/webm/Finding_Nemo_Teaser.webm",
                poster: "http://www.jplayer.org/video/poster/Finding_Nemo_Teaser_640x352.png"
            },
            {
                title: "Incredibles Teaser",
                artist: "Pixar",
                m4v: "http://www.jplayer.org/video/m4v/Incredibles_Teaser.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Incredibles_Teaser.ogv",
                webmv: "http://www.jplayer.org/video/webm/Incredibles_Teaser.webm",
                poster: "http://www.jplayer.org/video/poster/Incredibles_Teaser_640x272.png"
            }
        ], {
            swfPath: "js",
            supplied: "webmv, ogv, m4v",
            smoothPlayBar: true,
            keyEnabled: true
        });

});

//]]>

现在你能告诉我我很困惑怎么做。我的播放列表的名称是什么。谢谢。

4

1 回答 1

0

jPlayer 播放列表与当前播放列表的曲目编号一起使用......所以如果你想播放“Incredibles Teaser”歌曲，你可以这样做：

$(document).ready(function () {
    var currentpath = "";
    var myPlaylist = new jPlayerPlaylist({ // Don't forget to create a var containing the playlist object
            jPlayer: "#jquery_jplayer_1",
            cssSelectorAncestor: "#jp_container_1"
        }, [
            {
                title: "Big Buck Bunny Trailer",
                artist: "Blender Foundation",
                free: true,
                m4v: "http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Big_Buck_Bunny_Trailer.ogv",
                webmv: "http://www.jplayer.org/video/webm/Big_Buck_Bunny_Trailer.webm",
                poster: "http://www.jplayer.org/video/poster/Big_Buck_Bunny_Trailer_480x270.png"
            },
            {
                title: "Finding Nemo Teaser",
                artist: "Pixar",
                m4v: "http://www.jplayer.org/video/m4v/Finding_Nemo_Teaser.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Finding_Nemo_Teaser.ogv",
                webmv: "http://www.jplayer.org/video/webm/Finding_Nemo_Teaser.webm",
                poster: "http://www.jplayer.org/video/poster/Finding_Nemo_Teaser_640x352.png"
            },
            {
                title: "Incredibles Teaser",
                artist: "Pixar",
                m4v: "http://www.jplayer.org/video/m4v/Incredibles_Teaser.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Incredibles_Teaser.ogv",
                webmv: "http://www.jplayer.org/video/webm/Incredibles_Teaser.webm",
                poster: "http://www.jplayer.org/video/poster/Incredibles_Teaser_640x272.png"
            }
        ], {
            swfPath: "js",
            supplied: "webmv, ogv, m4v",
            smoothPlayBar: true,
            keyEnabled: true
        });

    myPlaylist.play(2); // Option 1 : Plays the 3rd item
    myPlaylist.play(-1); // Option 2 : Plays the last item

    // Now, if you want to click on a div to play something :
    $('#myDivID').on('click', function(){
        myPlaylist.play(2); // Option 1 : Plays the 3rd item
    });

});

这是此 jPlayer 插件的文档：http: //jplayer.org/latest/demo-02-jPlayerPlaylist/

于 2013-10-08T15:22:01.900 回答