Question

我有以下代码通过javascript在我的页面上插入带播放列表的流程图。现在我需要播放器从视频[播放]开始，这意味着播放列表中的预定义位置。控制台告诉我对象（v.flowplayer）没有方法播放...我做错了什么？

由于视频元素的来源，播放器从右侧视频开始，但使用.prev（）和.next（）函数，在使用.next（）后播放第二个视频会混淆播放列表顺序即使最初的视频是播放列表中的第5个视频。

var v = videos.eq(2);
            var p = $('<div class="fp-playlist"></div>');
            var vt = $('<video>');
            var s = $("<source>");
            var a;



            vt.attr({poster: playlist[playing].poster});
            s.attr({src: playlist[playing].url, type: "video/" + playlist[playing].videotype});
            v.append(vt.append(s));
            for(var i = 0; i < playlist.length; i++){
                a = $('<a href="{0}"></a>'.compose(playlist[i].url));
                p.append(a);
            }
            v.append(p);
            v.flowplayer().play(playing);

在javascript运行后，HTML看起来像这样：

<div class="video flowplayer no-volume fixed-controls no-toggle no-time is-mouseover video0 is-muted is-ready is-paused is-poster" data-embed="false" data-keyboard="false" data-fullscreen="false" style="background-image: url(somepic.jpg);">
<video poster="poster.jpg" class="fp-engine" src="somevid.webm"></video>
<div class="fp-playlist">
    <a href="somevid.mp4" data-index="0" class="is-active"></a>
    <a href="somevid.mp4" data-index="1"></a>
    <a href="somevid.mp4" data-index="2"></a>
    <a href="somevid.mp4" data-index="3"></a>
    <a href="somevid.mp4" data-index="4"></a>
    <a href="somevid.mp4" data-index="5"></a>
    <a href="somevid.mp4" data-index="6"></a>
    <a href="somevid.mp4" data-index="7"></a>
    <a href="somevid.mp4" data-index="8"></a>
    <a href="somevid.mp4" data-index="9"></a>
    <a href="somevid.mp4" data-index="10"></a>
    <a href="somevid.mp4" data-index="11"></a>
    <a href="somevid.mp4" data-index="12"></a>
    <a href="somevid.mp4" data-index="13"></a>
    <a href="somevid.mp4" data-index="14"></a>
    <a href="somevid.mp4" data-index="15"></a>
    <a href="somevid.mp4" data-index="16"></a>
    <a href="somevid.mp4" data-index="17"></a>
    <a href="somevid.mp4" data-index="18"></a>
    <a href="somevid.mp4" data-index="19"></a>
    <a href="somevid.mp4" data-index="20"></a>
    <a href="somevid.mp4" data-index="21"></a>
    <a href="somevid.mp4" data-index="22"></a>
    <a href="somevid.mp4" data-index="23"></a>
    <a href="somevid.mp4" data-index="24"></a>
    <a href="somevid.mp4" data-index="25"></a>
    <a href="somevid.webm" data-index="26"></a>
    <a href="somevid.mp4" data-index="27"></a>
    <a href="somevid.mp4" data-index="28"></a>
</div>
<div class="fp-ratio" style="padding-top: 56.25%;"></div>
<div class="fp-ui">
    <div class="fp-waiting">
        <em></em>
        <em></em>
        <em></em>
    </div>
    <a class="fp-unload"></a>
    <p class="fp-speed"></p>
    <div class="fp-controls">
        <a class="fp-play"></a>
        <div class="fp-timeline">
            <div class="fp-buffer" style="width: 100%;"></div>
            <div class="fp-progress"></div>
        </div>
        <div class="fp-volume">
            <a class="fp-mute"></a>
            <div class="fp-volumeslider" style="">
                <div class="fp-volumelevel" style="width: 0%;"></div>
            </div>
        </div>
    </div>
    <div class="fp-time">
        <em class="fp-elapsed">00:00</em>
        <em class="fp-remaining">00:12</em>
        <em class="fp-duration">00:12</em>
    </div>
    <div class="fp-message">
        <h2></h2>
        <p></p>
    </div>
</div>
<a href="http://flowplayer.org"></a>
<div class="fp-context-menu" style="left: 489.21875px; top: 179px; display: block;">
    <ul>
        <li class="copyright">© 2013</li>
        <li><a href="http://flowplayer.org">About Flowplayer</a>
        </li>
        <li><a href="http://flowplayer.org/license">GPL based license</a>
        </li>
    </ul>
</div>

Answer 1

v.flowplayer（）。play（播放）的最后一行javascript应该是：

v.data('flowplayer').play(playing);

Flowplayer从指定的播放列表索引开始

1 个答案: