停止所有播放的iframe视频上点击一个链接的JavaScript(Stop all playing

我在我的网页的IFRAME视频列表。

<iframe width="520" height="360" src="http://www.youtube.com/embed/2muxrT5_a6E" frameborder="0" allowfullscreen></iframe>
<iframe width="520" height="360" src="http://www.youtube.com/embed/2muxrT5_a6E" frameborder="0" allowfullscreen></iframe>
<iframe width="520" height="360" src="http://www.youtube.com/embed/2muxrT5_a6E" frameborder="0" allowfullscreen></iframe>
<a href="#" class="close">Stop all videos</a>

我需要停止播放所有视频的iframe点击链接Stop all videos 。 我怎样才能做到这一点？

Answer 1:

试试这个方法，

<script language="javascript" type="text/javascript" src="jquery-1.8.2.js"></script>
<script language="javascript" type="text/javascript">
$(function(){
    $('.close').click(function(){      
        $('iframe').attr('src', $('iframe').attr('src'));
    });
});
</script>

Answer 2:

这应该停止所有在网页上的所有I帧播放视频：

$("iframe").each(function() { 
        var src= $(this).attr('src');
        $(this).attr('src',src);  
});

Answer 3:

止动装置暂停和视频设置为0时：

        $('iframe').contents().find('video').each(function () 
        {
            this.currentTime = 0;
            this.pause();
        });

这个jQuery代码将这样做。

无需更换src属性和重新加载视频。

---

我用我的项目的小功能：

    function pauseAllVideos() 
    { 
        $('iframe').contents().find('video').each(function () 
        {
            this.pause();
        });
        $('video').each(function () 
        {
            this.pause();
        });
    }

Answer 4:

重装所有的I帧只是为了阻止他们是一个可怕的想法。 你应该得到的优势是什么自带HTML5。

如果不使用YouTube的iframe_API库; 你可以简单的使用方法：

var stopAllYouTubeVideos = () => { 
  var iframes = document.querySelectorAll('iframe');
  Array.prototype.forEach.call(iframes, iframe => { 
    iframe.contentWindow.postMessage(JSON.stringify({ event: 'command', 
  func: 'stopVideo' }), '*');
 });
}
stopAllYouTubeVideos();

这将停止所有youtubes iframe的视频。

您可以使用这些信息的关键字来启动/停止/暂停使用YouTube视频embdded：

stopVideo
playVideo
pauseVideo

看看下面的现场演示的链接：

https://codepen.io/mcakir/pen/JpQpwm

Answer 5:

我编辑上面的代码一点，以下为我工作.......

<script>
function stop(){<br/>
       var iframe = document.getElementById('myvid');<br/>
     var iframe1 = document.getElementById('myvid1');<br/>
      var iframe2 = document.getElementById('myvid2');<br/>
    iframe.src = iframe.src;<br/>
    iframe1.src=iframe1.src;<br/>
    iframe2.src=iframe2.src;<br/>
}<br/>

</script>

Answer 6:

$("#close").click(function(){
  $("#videoContainer")[0].pause();
});

Answer 7:

再次刷新所有的I帧停止视频

<a href="#" class="close" onclick="stop();">Stop all videos</a>

function stop(){
    var iframe = document.getElementById('youriframe');
    iframe.src = iframe.src;
}

Answer 8:

您可以修改此代码迭代

/**
 * Stop an iframe or HTML5 <video> from playing
 * @param  {Element} element The element that contains the video
 */
var stopVideo = function ( element ) {
    var iframe = element.querySelector( 'iframe');
    var video = element.querySelector( 'video' );
    if ( iframe ) {
        var iframeSrc = iframe.src;
        iframe.src = iframeSrc;
    }
    if ( video ) {
        video.pause();
    }
};

业主： https://gist.github.com/cferdinandi/9044694还张贴在这里（由我）： 如何彻底摧毁引导模式窗口？

文章来源: Stop all playing iframe videos on click a link javascript