如何完全禁用 YouTube iframe 全屏？ - Youtube Iframe API

Question

我已经在使用

创建 YouTube 播放器

playerVars: {
    controls: 0,
    fs: 0,
    disablekb: 1
}

但是在双击时，它仍然进入全屏，虽然它暂停然后继续播放。所以如果我可以只禁用全屏部分，它会工作正常。

（怎么可能）？

Answer 1

在 iframe 中您可以放置 donotallowfullscreen

<iframe src="https://www.youtube.com/embed/test"  donotallowfullscreen>
</iframe>

Answer 2

通过自己创建 iframe，我成功地解决了这个问题。这是代码：

const createYtPlayer = (videoId, container = inv) => new Promise(resolve => {
    const el = document.createElement('iframe');
    el.frameBorder = 0;
    el.setAttribute('allow', 'accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture');
    el.setAttribute('donotallowfullscreen', '');
    el.src = 'https://www.youtube.com/embed/' + videoId + '?disablekb=1&enablejsapi=1&controls=0&origin=' + encodeURIComponent(window.origin);
    container.appendChild(el);

    const player = new YT.Player(el, {
        height: 200,
        width: 200,
        videoId,
        playerVars: {
            controls: 0,
            fs: 0,
            disablekb: 1
        },
        events: {
            'onReady': () => {
                setBestSoundQuality(player);
                player.setVolume(100);
                resolve(player);
            }
        }
    });
});

})();

旧答案：

原来这可能是一个错误。我在@Paul Fitzgerald 的回答的帮助下做了一个解决方法，因为它有效。

出于某种原因，如果以任何方式存在 allowfullscreen，donotallowfullscreen 属性将不起作用（并且会自动添加 allowfullscreen）。

所以我添加了

const iframe = player.getIframe();
iframe.removeAttribute('allowfullscreen');
iframe.setAttribute('donotallowfullscreen', '');

添加到 onReady 事件，它起作用了。

编辑：它似乎只在 Firefox 中有效。

如何完全禁用 YouTube iframe 全屏？ - Youtube Iframe API

How to completely disable YouTube iframe fullscreen? - Youtube Iframe API

javascript

youtube-iframe-api