javascript - 如何在 jQuery 选项卡中播放一个视频并停止其他视频？

Question

我有 4 个 Jquery 选项卡，每个选项卡中有 2 个视频。如何让一个视频同时播放并暂停所有其他视频？以及当我切换到新标签时如何使视频暂停？

这是代码Jsfiddle

/* play one video at a time */

$('video').bind('play', function() {
  activated = this;
  $('video').each(function() {
      if(this != activated) {
          this.pause();
      }
  });
});

/* get the active tab */
var active = $( "#issuestabs" ).tabs( "option", "active" ); 


/* pause all videos that are not in the active tab*/ 

if (!active) {
    $("video").each(function(){
        $(this).get(0).pause();
    });

}

谁能告诉我出了什么问题吗？

谢谢!

Answer 1

你可以使用:

$('.tab').on('click', function() {
  $('.tabcontent:hidden').find('video').each(function() {
    $(this).get(0).pause();
  });
});

(其中 .tabcontent 是隐藏/显示的内容面板的名称，我显示的单击功能只是一个示例，因为我不知道您使用哪个库用于选项卡。)