2014-11-19 4 views
0

Первое видео загружается в 1080p, чем когда я нажимаю кнопку с class="quality" Это должно изменить качество в 720p, но it's not working in HTML5 player.setPlaybackQuality не работает YouTube JS API

Он работает на Flash Player, но не в HTML5. Я использую API JavaScript Player.

Примечание: Ни одно из этих решений не работало для меня. YouTube API плавающего фрейма "setPlaybackQuality" или "suggestedQuality" не работает

function onPlayerReady(event) { 
    event.target.playVideo(); 
    event.target.setPlaybackQuality('hd1080'); //works 
} 

function onPlayerStateChange(event) { 
    if (event.data == YT.PlayerState.PLAYING) { 
     $(".quality").click(function() { 
      event.target.setPlaybackQuality('hd720'); //doesn't work 
     });  
    } 
} 

Проблема заключается в том, вы не можете понизить качество. Как только вы установите 1080p для ex, вы не сможете вернуться к 720p.

+0

возможно дубликат [YouTube IFrame API "setPlaybackQuality" или "suggestedQuality" не работает] (http://stackoverflow.com/questions/8802498/youtube-iframe-api-setplaybackquality-or-suggestedquality-not- работа) –

ответ

1

Я привел пример с этого сайта YouTube Player API Reference for iframe Embeds. Я вручную добавил одну кнопку, чтобы изменить качество, которое работает абсолютно нормально. Вот рабочий код.

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    </head> 
    <body> 
     <button id="change_quality">Change Quality</button> 
     <div id="player"></div> 
     <script> 
      var tag = document.createElement('script'); 
      tag.src = "https://www.youtube.com/iframe_api"; 
      var firstScriptTag = document.getElementsByTagName('script')[0]; 
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 
      var player; 
      function onYouTubeIframeAPIReady() { 
       player = new YT.Player('player', { 
       height: '390', 
       width: '640', 
       videoId: 'M7lc1UVf-VE', 
       events: { 
        'onReady': onPlayerReady, 
        'onStateChange': onPlayerStateChange 
       } 
       }); 
      } 
      function onPlayerReady(event) { 
       event.target.playVideo(); 
       event.target.setPlaybackQuality('360p'); 
      } 
      function onPlayerStateChange(event) { 
       if (event.data == YT.PlayerState.PLAYING) { 
        $("#change_quality").click(function() { 
         event.target.setPlaybackQuality('240p'); 
        }); 
       } 
      } 
     </script> 
    </body> 
</html> 

Первоначально onPlayerReady качество устанавливается в 360p. После нажатия на Изменить качество кнопка качество установлено 144p.

+0

Проблема в том, что вы не можете понизить качество. Как только вы установите 1080p для ex, вы не сможете вернуться к 720p См. Мой обновленный вопрос или задайте значения hd1080, а затем кнопку #change quality hd720 @Varun –

+0

@rexhin. В моем примере я также понижаю качество от 360p до 144p. –

+0

Да, но он, похоже, работает от 1080p до 720p @Varun –

0

Попробуйте остановить видео, затем установите качество воспроизведения, а затем возобновите воспроизведение.

function onPlayerStateChange(event) { 
    $(".quality").click(function() { 
     event.target.stopVideo(); 
     event.target.setPlaybackQuality('hd720'); 
     event.target.playVideo(); 
    });  
} 
Смежные вопросы