单击图像后如何播放/启动YouTube视频?

时间:2011-09-13 17:37:43

标签: javascript jquery api youtube click

我有一张图片,我想在点击图片后才启动youtube视频。我怎么能这样做?

非常感谢!

5 个答案:

答案 0 :(得分:8)

看看:

Youtube API examples

代码将是这样的:

function onPlayerReady(event) {
    $('img').click(function() { 
        ytPlayer.playVideo();
    });
}

答案 1 :(得分:7)

.click() JQuery事件处理程序:

$("#clickMe").click(function(){
  $("#iframe")[0].src += "&autoplay=1";
  ev.preventDefault();
});

答案 2 :(得分:6)

另一种方法 - 使用“?autoplay = 1”版本切换iframe SRC(URL)。

<a href="#" id="clickMe">PLAY</a>

<iframe id="iframe" width="1280" height="720" src="//www.youtube.com/embed/F0naUkyEkmM" 
            data-autoplay-src="//www.youtube.com/embed/F0naUkyEkmM?autoplay=1"></iframe>

jQuery的:

jQuery("#clickMe").on('click',function(){
    var vi = jQuery("#iframe");
    vi.attr("src", vi.data("autoplay-src") );
});

答案 3 :(得分:1)

我认为这会对你有所帮助。对我来说很好。

&#13;
&#13;
$('.trigger').on('click', function () {
    $(".video")[0].src += "1";
});
&#13;
<a href="#" class="trigger">Click</a>
        
<iframe class="video" src="https://www.youtube.com/embed/HJX71gFz_do?autoplay=" frameborder="0" allowfullscreen></iframe>
&#13;
&#13;
&#13;

答案 4 :(得分:0)

添加autoplay = 1似乎只是第一次工作。我正在使用开始/停止按钮,当我第一次点击它时,我添加了autoplay = 1。然后当我再次点击它时,我删除了autoplay = 1。这很好。

但是当我尝试再次启动它时(添加autoplay = 1),它就不会启动。