使用javascript或jquery暂停youtube视频

时间:2013-11-08 07:20:06

标签: javascript jquery html iframe youtube

我需要使用jQuery或javascript暂停youtube视频

我在js中的代码

var class_name = $('#videobuttonChange').attr('class').split(' ')[1];
if (class_name == "play") {
    $("#vid_url").html('<iframe width="100%" height="270px" id="v_frame" src="http://www.youtube.com/v/uPiVOofEPHM?version=3&f=playlists&c=youtube_it&app=youtube_gdata&autoplay=1" frameborder="0" allowfullscreen wmode="Opaque"></iframe>');
} else {
    $("#vid_url").html('<iframe width="100%" height="270px" id="v_frame" src="http://www.youtube.com/v/uPiVOofEPHM?version=3&f=playlists&c=youtube_it&app=youtube_gdata" frameborder="0" allowfullscreen wmode="Opaque"></iframe>');
}

在其他情况下,我需要暂停视频,但我的代码会停止播放视频。如何暂停视频。

任何人都会指导我。

3 个答案:

答案 0 :(得分:1)

您可以先尝试有条件地配置iframe,然后再将其附加到DOM:

var video = $('<iframe></iframe>');
    video.attr({'width': '100%',
                'height': '270px',
                'id': 'v_frame',
                'src': 'http://www.youtube.com/v/uPiVOofEPHM?version=3&f=playlists&c=youtube_it&app=youtube_gdata',
                'frameborder': '0',
                'allowfullscreen': '',
                'wmode': 'Opaque'});

if($('#videobuttonChange').hasClass('play')) {
   video.attr('src', video.attr('src') + '&autoplay=1');
}
video.appendTo($("#vid_url"));

答案 1 :(得分:0)

您可以使用 YouTube JavaScript Player API

<body>
<div id="videobuttonChange" class="play"></div>
<div id="vid_url"></div>

<script src="http://www.youtube.com/iframe_api"></script>

<script>
    var player;

function onYouTubePlayerAPIReady() {   //create iframe in #vid_url   
    player = new YT.Player('vid_url', {
        height: '270px',
        width: '100%',
        videoId: 'uPiVOofEPHM'
    });

    setTimeout(function () { //as it is asynchronous  
        if ($('#videobuttonChange').hasClass("play")) {
            player.playVideo();
        } else {
            player.pauseVideo();
        }
    }, 2000);

}
</script>

小提琴http://jsfiddle.net/code_snips/gNF6q/     

答案 2 :(得分:-2)

$('iframe').each(function(i,e){
    let iframeSrc = $(e).attr('src');
    $(e).attr('src',iframeSrc);
});

这将重置所有视频的 src,您可以将其修改为仅定位一个