如何访问 iframe 的事件“onplay()”？答案

【问题标题】：How to access event "onplay()" for iframe?如何访问 iframe 的事件“onplay()”？
【发布时间】：2016-11-25 08:47:39
【问题描述】：

我在一页中有两个 iframe。

<iframe id="video" width="420" height="315" src="//www.youtube.com/embed/9B7te184ZpQ?rel=0" frameborder="0" allowfullscreen></iframe>
<iframe id="video1" width="420" height="315" src="//www.youtube.com/embed/9B7te184ZpQ?rel=0" frameborder="0" allowfullscreen></iframe>

我想访问 iframe 的onplay() 事件，然后我可以在播放第一个视频(#Video) 时停止第二个视频(#Video1) 并在播放第二个(@) 时停止第一个视频(#Video) 987654326@).

可以使用YoutubeAPI，但我不想使用它，因为我有其他 url 视频而不是 Youtube 视频（这里我放了 youtube 链接而不是原始链接以避免版权）。除了YoutubeAPI，还有其他方法吗？ YoutubeAPI 未处理其他链接资源。请提出建议。

【问题讨论】：

JS代码中无法访问跨域iframe的内容。
谢谢。是否有另一种方法可以在播放当前视频时停止其他视频。

标签： javascript jquery video iframe

【解决方案1】：

它有两个<iframe>。首先，您需要在iframe 之间切换。

Is there a way to change context to iframe in javascript console?

之后，这里是我的代码如何访问<iframe>的事件onPlay()

<script src="https://www.youtube.com/iframe_api"></script>

<div class="module module-home-video">
    <span class="module-strip">Latest Product Video</span>
    <div id="video"></div>
</div>

<script>
    var player, playing = false;
    function onYouTubeIframeAPIReady() {
        player = new YT.Player('video', {
            height: '360',
            width: '640',
            videoId: 'xmhtV4270NU',
            events: {
                'onStateChange': onPlayerStateChange
            }
        });
    }

    function onPlayerStateChange(event) {
        if(!playing){
            alert('onPlay is clicked');
            playing = true;
        }
    }
</script>

【讨论】：

谢谢，但正如我提到的，我只能使用 YoutubeAPI。有没有不使用 YoutubeAPI 的其他方法。