有没有办法让嵌入式 Youtube 视频只播放一次?
Is there a way for Embeded Youtube videos to play only once?
我希望我的 YouTube 视频只能播放一次。这可能吗?我正在使用 iframe,但无法在网上找到任何东西。如果能提供任何帮助,我将不胜感激!
如果您将播放器控件设置为 0 应该是可能的。您可以在 this website. 上找到它的示例 它不会让它播放一次,但会让用户无法在任何其他时间干扰视频比停止它的方式。
是的,你能做到。阅读 iframe api 它有很多有用的函数和变量。
我不知道如果 iframe 元素是在 html 中制作的,但您可以通过 Javascript 制作它,就像 API 展示的那样。
这是您正在寻找的示例,iframe 似乎在堆栈代码段中不起作用。这是一个演示:https://jsfiddle.net/215mekhd/
您还可以使用隐藏控制器:playerVars: { 'controls': 0 },
在第二个 YT.Player
参数的设置对象中。
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player_id', {
height: '390',
width: '640',
videoId: 'fUXdrl9ch_Q',
playerVars: {
'playsinline': 1
},
events: {
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
if (event.data == 0) {
player.destroy();
}
}
<html>
<body>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player_id">this will be replaced with a video</div>
</body>
</html>
进行嵌入时,只需在视频 ID 后添加“&autoplay=1”(视频中的字母顺序 url);现在您添加了“&mute=1”,因为 YouTube 不允许视频自动播放(如果它们现在没有静音)。此外,除非您循环播放,否则您的视频默认只会播放一次
这是没有任何调整的嵌入代码:
<iframe width="560" height="315" src="https://www.youtube.com/embed/FJ3Bo2_x_PE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
现在具有自动播放和静音属性:
<iframe width="560" height="315" src="https://www.youtube.com/embed/FJ3Bo2_x_PE?&autoplay=1&mute=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
您可以查看此 codepen 以了解实际效果
我希望我的 YouTube 视频只能播放一次。这可能吗?我正在使用 iframe,但无法在网上找到任何东西。如果能提供任何帮助,我将不胜感激!
如果您将播放器控件设置为 0 应该是可能的。您可以在 this website. 上找到它的示例 它不会让它播放一次,但会让用户无法在任何其他时间干扰视频比停止它的方式。
是的,你能做到。阅读 iframe api 它有很多有用的函数和变量。
我不知道如果 iframe 元素是在 html 中制作的,但您可以通过 Javascript 制作它,就像 API 展示的那样。
这是您正在寻找的示例,iframe 似乎在堆栈代码段中不起作用。这是一个演示:https://jsfiddle.net/215mekhd/
您还可以使用隐藏控制器:playerVars: { 'controls': 0 },
在第二个 YT.Player
参数的设置对象中。
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player_id', {
height: '390',
width: '640',
videoId: 'fUXdrl9ch_Q',
playerVars: {
'playsinline': 1
},
events: {
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
if (event.data == 0) {
player.destroy();
}
}
<html>
<body>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player_id">this will be replaced with a video</div>
</body>
</html>
进行嵌入时,只需在视频 ID 后添加“&autoplay=1”(视频中的字母顺序 url);现在您添加了“&mute=1”,因为 YouTube 不允许视频自动播放(如果它们现在没有静音)。此外,除非您循环播放,否则您的视频默认只会播放一次
这是没有任何调整的嵌入代码:
<iframe width="560" height="315" src="https://www.youtube.com/embed/FJ3Bo2_x_PE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
现在具有自动播放和静音属性:
<iframe width="560" height="315" src="https://www.youtube.com/embed/FJ3Bo2_x_PE?&autoplay=1&mute=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
您可以查看此 codepen 以了解实际效果