无法自动播放隐藏在自定义缩略图后面的Youtube视频

Unable to Autoplay Youtube video hiding behind a custom thumnail

本文关键字：Youtube 视频 略图 自动播放 隐藏 自定义      更新时间：2023-09-26

我使用自定义缩略图的youtube视频，所以当它点击实际视频显示，但用户必须再次点击播放视频。我希望在点击图像时自动播放。这里是标记(fiddle)

<div id="kill" onclick="thevid=document.getElementById('thevideo'); thevid.style.display='block'; this.style.display='none'">
<img align="left" alt="royal music for cattle by farmer Derek with a trombone goes viral via geniushowto.blogspot.com videos" class="rimp" src="http://bit.ly/1pITz0L" style="cursor: pointer;" title="click to play royal music by Farmer Derek" /></div>
<div itemprop="video" itemscope itemtype="http://schema.org/VideoObject" class="video-container" id="thevideo" style="display: none;">
<iframe id="ytvid" allowfullscreen="" frameborder="0" height="360" src="//www.youtube.com/embed/qs_-emj1qR4?rel=0&amp;controls=1&amp;showinfo=0&amp;cc_load_policy=0&amp;iv_load_policy=3&amp;modestbranding=1&amp;theme=light&amp;autohide=0&amp;autoplay=0" width="640"></iframe></div>

这是我用来在点击时将自动播放从0改为1的脚本。

<script>
$('#kill').click(function() {
$("iframe#ytvid").attr("src", $("iframe#ytvid").attr("src").replace("autoplay=0", "autoplay=1"));});
</script>

但是它不工作!

我也试过这样做，但这次没有在Youtube url中的dummy autoplay=0。

<script>
$('#kill').click(function() {
$("#ytvid iframe").attr('src', $("#ytvid iframe", parent).attr('src') + '?autoplay=1');});
</script>

但不幸的是这个也失败了。我做错什么了吗?一个解决方案会很有帮助。

看起来您只是错过了rel=0参数

var source = $("#ytvid").attr('src') + "?rel=0&autoplay=1";

从你的第二个例子派生- http://jsfiddle.net/mvdL6q1j/

使用

jsfiddle http://jsfiddle.net/harshdand/7s6p1a6d/5/

$('#kill').click(function() {
    var src = $("#ytvid").attr('src');
    $("#ytvid").attr('src',src+'autoplay=1');
 });
相关文章：