我尝试使用YouTube player demo生成视频自动播放和循环所需的代码。 但只有自动播放工作,它不循环,并且演示视频也不起作用。这是我用过的代码。
<iframe class="embed-responsive-item" id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?&autoplay=1&loop=1&rel=0&showinfo=0&color=white&iv_load_policy=3" frameborder="0" allowfullscreen>
</iframe>
答案 0 :(得分:113)
尝试添加playlist
参数以及循环。对于播放列表,请将其值设置为当前视频ID。
<iframe class="embed-responsive-item"id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?&autoplay=1&loop=1&rel=0&showinfo=0&color=white&iv_load_policy=3&playlist=M7lc1UVf-VE"
frameborder="0" allowfullscreen></iframe>
目前,loop参数仅在与播放列表参数一起使用时才在AS3播放器中有效。要循环单个视频,请将循环参数值设置为1,并将播放列表参数值设置为已在播放器API网址中指定的相同视频ID:
http://www.youtube.com/v/VIDEO_ID?version=3&loop=1&playlist=VIDEO_ID
参考:https://developers.google.com/youtube/player_parameters#loop
答案 1 :(得分:2)
接受的答案对我也不起作用。 2018年9月的解决方法(奖金:通过CSS为#yt-wrap
设置宽度和高度,而不是在JS中对其进行硬编码):
<div id="yt-wrap">
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="ytplayer"></div>
</div>
<script>
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_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 onYouTubePlayerAPIReady() {
player = new YT.Player('ytplayer', {
width: '100%',
height: '100%',
videoId: 'VIDEO_ID',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.playVideo();
player.mute(); // comment out if you don't want the auto played video muted
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.ENDED) {
player.seekTo(0);
player.playVideo();
}
}
function stopVideo() {
player.stopVideo();
}
</script>
答案 2 :(得分:2)
像这样使用原生” ,请确保也为播放列表使用相同的视频ID值。
例如,如果视频ID为SpongeBOB 那么网址将是这样的:
https://www.youtube.com/embed/ SpongeBOB ?playlist = SpongeBOB &loop = 1
以下是反应本机网络视图
中的实现<WebView
javaScriptEnabled={true}
domStorageEnabled={true}
mediaPlaybackRequiresUserAction={true}
style={{ height:180, width:300,alignSelf:"center",alignContent:"center"}}
source={{uri: 'https://www.youtube.com/embed/qD101Xlc5uw?playlist=qD101Xlc5uw&loop=1' }}
/>
答案 3 :(得分:1)
'playlist': '<?php echo $youtube_video ?>'
在playerVars中。
例如完整代码:
<script>
// 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', {
height:'100%',
width: '100%',
fitToBackground: true,
videoId: '<?php echo $youtube_video ?>',
playerVars: {
'autoplay': 1,
'controls': 0,
'autohide':1,
'enablejsapi':1,
'loop':1,
'disablekb':1,
'fs': 0,
'modestbranding': 0,
'showinfo': 0,
'color': 'white',
'theme': 'light',
'rel':0 ,
'playlist': '<?php echo $youtube_video ?>'
},
events: {
'onReady': onPlayerReady
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.playVideo();
player.mute();
player.setVolume(0);
//player.setSize(1920, 1080);
player.setLoop(true);
player.setPlaybackQuality('hd1080');
}
您的Html代码:
<div id="player"></div>
如果您想将视频保存在变量中,请使用:
<?php $youtube_video='C0DPdy98e4c';?>
答案 4 :(得分:1)
我只想弄清楚:你需要播放playlist =“”来使用循环
src =“https://www.youtube.com/embed/peSfCy7HFrM?playlist=peSfCy7HFrM&loop=1;rel=0&autoplay=1&controls=0&showinfo=0”frameborder =“0”allowfullscreen&gt ;
答案 5 :(得分:0)
您需要添加 https://www.youtube.com/embed/VIDEO_ID?playlist=VIDEO_ID&loop=1
注意播放列表 = VIDEO_ID 是强制性的,并且设置为单个视频的视频 ID
所以在我的情况下,网址是
https://www.youtube.com/embed/C5tG7pztlb0?playlist=C5tG7pztlb0&loop=1&autoplay=1&controls=1&showinfo=0&mute=1
静音已开启 显示信息已关闭 显示控件已关闭 自动播放已开启 循环开启
答案 6 :(得分:-1)
这是嵌入式循环播放列表的另一个有效示例:
<iframe width="1019" height="573" src="https://www.youtube.com/embed/videoseries?list=PLDz-3V1_TIyhVYiJeGdqc9bjpAf9L9Zfq&loop=1" frameborder="0" allow="accelerometer; autoplay " ;"="" =""="" encrypted-media;="" gyroscope;="" picture-in-picture"="" allowfullscreen=""></iframe>