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

时间:2014-08-10 06:12:33

标签: javascript jquery html video youtube

我正在为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网址中没有虚拟自动播放= 0.(fiddle-2

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

但不幸的是,这一次也失败了。我在这里做错了吗?解决方案将非常有帮助。提前谢谢。

2 个答案:

答案 0 :(得分:2)

看起来你刚刚错过了rel = 0 param

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

从你的第二个例子中被迫 - http://jsfiddle.net/mvdL6q1j/

答案 1 :(得分:1)

使用此

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

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