JWPlayer时间搜索区域和重置vars

Question

目标是创建一个只能通过外部事件播放的视频播放器，这是一次点击。click事件包含一个数据attr，指定要播放的区域，即.10秒到25秒。

存在多个按钮。每次失效后，它都需要暂停视频。

按钮顺序将以随机顺序出现。

下面是示例代码：http://jsfiddle.net/arkjoseph/n2rpq1t4/28/

    <div id="player"></div>


<section>
    <div class="seeker" data-start="0" data-end="5">Go to 0-5</div>
</section>
<section>
    <div class="seeker" data-start="6" data-end="10">Go to 6-10</div>
</section>



$(function(){

    $("section").each(function(){
        $(this).find(".seeker").on('click',function(event){
            var start = $(this).data('start'),
                end   = $(this).data('end');
            seekitnow(start,end);              
        });
    }); 
});

function seekitnow(start,end) {
    jwplayer("player").seek(start).onTime(function(event) {
        var start;
        if(event.position >= end) {
            this.pause();
        }
        //var end;
     });
   }

这些操作在一定程度上有效，但每次单击按钮都会注册存储的现有变量(开始/结束)。我怎样才能防止这种情况发生呢？

如果我单击按钮1 (0-5)，它可以正常工作。如果我点击6-10，视频停止，控制台有0,5,6,10.

帮助!

Answer 1

我试了一下，想弄清楚到底是什么奇怪的行为。

我注意到，每次单击Go to 0-5和Go to 6-10部分时，都会调用jwPlayer.onTime()，同时创建新的jwPlayer处理程序(jwplayer("player").seek(start).onTime(function(event) {)，从而将新的回调添加到jwPlayer时间更改事件的回调队列中。

这引起了许多奇怪的行为，因为我继续点击部分。

我更改了代码，使onTime()只执行一次，end是共享状态，然后分叉jsFiddle。

由此产生的行为是：

• 单击Go to 0-5时，视频试图计时0，并在到达第二个5时暂停。
• 当点击Go to 6-10时，视频寻求第二个5，当到达第二个10时暂停。

这是正确的行为吗？：https://jsfiddle.net/a8dao9d4/

jwplayer("player").setup({
    file: "https://player.vimeo.com/external/135492851.hd.mp4?s=a61836463fbde188aaa1e24e6bfeeb39&profile_id=113",
    startparam: "starttime",
});

$(function(){

    var player = jwplayer("player");
    var end = 32;

    player.onTime(function(event) {
        if(event.position >= end) {
            this.pause();
        }
    });

    $("section").each(function(){
        $(this).find(".seeker").on('click',function(event){
            end = $(this).data('end');

            player.seek(
                $(this).data('start')
            );
        });
    });

});