Tạm dừng video youtube, youtube api

Question

Tôi đang cố gắng để tạm dừng và chơi video YouTube với đoạn mã sau đó là khá nhiều bản sao từ Youtube API page:

// 2. This code loads the IFrame Player API code asynchronously. 
var tag = document.createElement('script'); 
tag.src = "http://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('player', { 
     height: '315', 
     width: '560', 
     videoId: 'bpOR_HuHRNs', 
    }); 
} 

Here's a demo in jsFiddle

Tuy nhiên, nó không làm việc . Bất cứ ai cũng có một ý tưởng làm thế nào để làm điều này?

Answer 1

Sử dụng player.playVideo(); (resume) và player.pauseVideo(); (tạm dừng) khi người chơi đã sẵn sàng: http://jsfiddle.net/4WPmY/6/

function onYouTubePlayerAPIReady() { 
    player = new YT.Player('player', { 
        height: '315', 
        width: '560', 
        videoId: 'bpOR_HuHRNs', 
    }); 
    document.getElementById('resume').onclick = function() { 
        player.playVideo(); 
    }; 
    document.getElementById('pause').onclick = function() { 
        player.pauseVideo(); 
    }; 
} 

Answer 2

Trong HTML của bạn, có một số nút để điều khiển video:

<input type="button" id="play"> 
<input type="button" id="pause"> 

Sử dụng jQuery, liên kết trình xử lý sự kiện (nhấp chuột) để kích hoạt một chức năng trên đối tượng trình phát của bạn:

$(function() { 
    $('#play').click(function() { 
    player.playVideo(); 
    }); 
    $('#pause').click(function() { 
    player.pauseVideo(); 
    }); 
}); 

Tôi đã tạo ứng dụng bằng Trình phát dữ liệu và Trình phát của YouTube. Mất những gì bạn cần: https://github.com/HunterMeyer/YouTV

Answer 3

<div id="player"></div> 
<a href="#" id="resume">Play</a> 

Trong mã này tôi đã thêm Resume và Pause nút trong một: Example

// 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('player', { 
     height: '315', 
     width: '560', 
     videoId: '0Bmhjf0rKe8', 
     events: { 
      'onStateChange': onPlayerStateChange 
     } 
    }); 
    document.getElementById('resume').onclick = function() { 
     PlayPause(); 
     return false; 
    }; 
} 
// 4. This function change name of tag click. 
var playerState; 
function onPlayerStateChange(event) { 
    var getId = document.getElementById('resume'); 
    if(event.data === 0) { 
     getId.innerText = 'Play'; 
    } 
    else if(event.data === 1) { 
     getId.innerText = 'Pause'; 
    } 
    else if(event.data === 2) { 
     getId.innerText = 'Resume'; 
    } 
    else if(event.data === 3) { 
     getId.innerText = 'Loading...'; 
    } 
    playerState = event.data; 
} 
// 5. This function Play/Pause the video. 
function PlayPause() { 
    if(playerState == '1') { 
     player.pauseVideo(); 
    } 
    else { 
     player.playVideo(); 
    } 
}