首页 > 解决方案 > 当我单击另一个选项卡时如何自动停止视频

问题描述

我使用选项卡在视频服务器之间进行切换,但我遇到了问题。当我单击另一个选项卡时,第一个选项卡中的视频继续播放我尝试了一些方法和功能,但不适用于我,如果有人可以帮助我,我对 JavaScript 一无所知,我将非常感谢您的帮助

<div class="mtabs_wrapper">
<!-- Original tabs START -->

<div id="mtabs">
    <ul>
        <li><a href="#tab1" rel="tab1">Openload</a></li>
        <li><a href="#tab2" rel="tab2">Streamango</a></li>
        <li><a href="#tab3" rel="tab3">Ok.Ru</a></li>
        <li class="active"><a href="#tab4" rel="tab4">Upvid</a></li>
    </ul>
</div>

<div id="mtabs_content_container">
    <div id="tab1" class="mtab_content">
      <p><a id="simulate" href="#mtabs_wrapper#mtabs_content_container#tab2">
              <iframe class="resp-container" src="https://oload.club/embed/CAr3JJIPf8Y/"   height="485"  style="width:100%; name="search_iframe" frameborder="0" allowfullscreen="allowfullscreen" sandbox="allow-forms allow-pointer-lock allow-same-origin allow-scripts allow-top-navigation" ></iframe>  

    </div>
    <div id="tab2" class="mtab_content">
    <iframe class="resp-container" src="https://oload.club/embed/CAr3JJIPf8Y/"  height="485"  style="width:100%; name="search_iframe" frameborder="0" allowfullscreen="allowfullscreen"></iframe>  
    </div>
    <div id="tab3" class="mtab_content">
    <iframe class="resp-container" src="https://oload.club/embed/CAr3JJIPf8Y/"  height="485"  style="width:100%; name="search_iframe" frameborder="0" allowfullscreen="allowfullscreen"></iframe>  
    </div>
<div id="tab4" class="mtab_content" style="display: block;">

    <iframe class="resp-container" src="https://oload.club/embed/CAr3JJIPf8Y/"  height="485"  style="width:100%; name="search_iframe" frameborder="0" allowfullscreen="allowfullscreen"></iframe>  

</div>
<!-- Original tabs END -->

标签: javascriptjquery

解决方案


尝试这个。我用过windows事件

 $(window).focus(function() {
        $('#video_id').play();
    });

    $(window).blur(function() {
        $('#video_id').pause();
    });

更新

从这里引用

如果设置了安全选项,Firefox 只会服从引发窗口的请求,并且默认情况下未设置。据我所知,Chrome 根本不会关注 focus() 请求。Safari 确实服从 focus() 请求。

具体的 Firefox 设置在“工具”->“选项”(Linux 上的“编辑->首选项”,可能是 MacOS)对话框中。有一个“内容”选项卡,其中有一个用于启用 Javascript 的复选框。随之而来的是一个“高级”按钮,它会打开另一个对话框,其中可以找到一个复选框以允许(或禁止)通过页面代码提升和降低窗口。


推荐阅读