Question

当我在引导标签之间切换时，如何让视频开始播放？

$('#tab').on('click', function() {
  $('.active').find('video').each(function() {
    $('#video').play();
  });
});

Answer 1

要实现此目的，您可以在显示选项卡时挂钩Bootstrap触发的事件：shown.bs.tab。然后，您可以在之前标签的视频中致电stop()，同时在当前标签上拨打start()。试试这个：

$('#tab').on('shown.bs.tab', function(e) {
  // start videos in new tab
  $(e.target).find('video').each(function() {
    this.play();
  });

  // stop videos in old tab
  $(e.relatedTarget).find('video').each(function() {
    this.stop();
  });
});

documentaton

中提供了有关Bootstrap选项卡事件的更多信息

Answer 2

如果你想回到原来的标签并从中断的地方继续，你可以添加到rorys的答案，你可以$('#video').pause()

Answer 3

请勿使用该ID。如果使用ID选择器，jQuery只返回单个元素（只会选择DOM中的第一个匹配元素）。使用此：

$('#tab a').on('click', function () {
 $('#tab .active').find('video').each(function (video) {
   $(video).get(0).play();
 });
});

阅读this。

当我在引导程序选项卡之间切换时，如何让视频开始播放？

3 个答案: