Question

我正在使用引导标签在我的网站中的视频之间切换，但我遇到了问题。当我点击另一个标签时，第一个标签中的视频继续播放，所以我搜索了一下，我可以说它与javascript有关！是的我不知道任何关于JavaScript的东西只是一些HTML，CSS，PHP和SQL但没有JavaScript。所以，如果任何人可以帮助我，我真的很感激帮助（（我使用很多视频托管网站，如youtube，dailymotion，ok.ru和lest继续）如果任何人可以帮助我一些代码我会真的感谢！这是我的代码

<ul class="nav nav-tabs centered">
    <li class="active"><a data-toggle="tab" href="#video1">video 1</a></li>
    <li><a data-toggle="tab" href="#video2">video 2</a></li>
    <li><a data-toggle="tab" href="#video3">video 3</a></li>
</ul>

<div class="tab-content">
    <div id="video1" class="tab-pane fade in active" style="padding:5px">
        <div class="embed-responsive embed-responsive-16by9">
          <iframe class="embed-responsive-item" src="'.$rows['video1'].'" allowfullscreen></iframe>
        </div>
    </div>
    <div id="video2" class="tab-pane fade" style="padding:5px">
        <div class="embed-responsive embed-responsive-16by9">
            <iframe class="embed-responsive-item" src="'.$rows['video2'].'" allowfullscreen></iframe>
        </div>
    </div>
    <div id="video3" class="tab-pane fade" style="padding:5px">
        <div class="embed-responsive embed-responsive-16by9">
            <iframe class="embed-responsive-item" src="'.$rows['video3'].'" allowfullscreen></iframe>
        </div>
    </div>
</div>

提前致谢

Answer 1

我认为你实际上不能这样做，因为“Same-origin policy”。

很明显，您的网站A不能通过iframe在网站B上使用javascript / datas。您可以使用服务器上托管的视频播放器（在这种情况下仅限网站A）执行此操作。

Answer 2

您可以使用hidden.bs.tab事件来处理暂停视频的代码。完全隐藏选项卡时会触发此事件。
引导标签文档：here

<强> JS：

$('a[data-toggle="tab"]').on('hidden.bs.tab', function (e) {
  var video_element= $(e.target);
  //Your code for pausing the video
  });

单击另一个选项卡时停止视频

2 个答案: