YouTubeのプレーヤーオブジェクトに動画IDを動的に追加する

Question

YouTubeの動画をウェブビューで再生するアンドロイドアプリがあります。ユーザーが再生中のビデオを変更したときに、ビデオIDを変更したい。ここに私のコードは、

<div id="player"></div> 

<script> 
    // 2. This code loads the IFrame Player API code asynchronously. 
    var tag = document.createElement('script'); 

    tag.src = "https://www.youtube.com/iframe_api"; 
    var firstScriptTag = document.getElementsByTagName('script')[1]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

    // 3. This function creates an <iframe> (and YouTube player) 
    // after the API code downloads. 
    var player; var stime; var etime; 
    function onYouTubeIframeAPIReady() { 
    player = new YT.Player('player', { 
     height: '390', 
     width: '640', 
     videoId: 'ia8CKDIur3s', 
     events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onPlayerStateChange 
     } 
    }); 


    // 4. The API will call this function when the video player is ready. 
    function onPlayerReady(event) { 
    if(event.target.a.id == "player"){ 
     event.target.playVideo(); 
    } 
    } 

    // 5. The API calls this function when the player's state changes. 

    var done = false; 
    function play(){ 
    document.getElementById("status").innerHTML = "working"; 

    player.loadVideoById({videoId:'ia8CKDIur3s', 
        startSeconds:stime, 
        endSeconds:etime, 
        suggestedQuality:'large'}); 
    } 
    function onPlayerStateChange(event) { 
    if(etime!=null){ 
     play(); 
     etime=null; 
    } 
    } 

    function getStartTime() { 
    stime = player.getCurrentTime(); 
    document.getElementById("start").innerHTML = stime; 
    } 

    function getEndTime() { 
    etime = player.getCurrentTime(); 
    document.getElementById("end").innerHTML = etime; 

    } 
    </script> 

あるユーザーは、開始時刻と終了時刻を指定することで、ビデオの一部を選択し、同じYouTubeのプレーヤーでそのビデオセグメントを再生することができます。

AndroidのアクティビティからこのHTMLコードに動画IDを渡す方法が必要です。

ありがとうございます。

Answer 1

あなたは、これはあなたが上記実行した初期化コードの後に​​ある 、HTMLでIDを格納したテキスト入力を必要としています。 HTML要素のにOnclick = "" インサイド

：

document.getElementById('YouTube-video-id').value='DrQRS40OKNE'; 
youTubePlayerChangeVideoId(); 

そして、あなたのJSスクリプト

function youTubePlayerChangeVideoId() { 
    'use strict'; 
    var inputVideoId = document.getElementById('YouTube-video-id'); 
    var videoId = inputVideoId.value; 
    var quality = $("#quality-selector option:selected").text();  
    youTubePlayer.cueVideoById({suggestedQuality: quality, 
    videoId: videoId 
}); 
} 

にここで私は、私は「

<select id="quality-selector" class="uk-input"> 
    <option>small</option> 
    <option selected="">medium</option> 
    <option>large</option> 
    <option>hd720</option> 
    <option>hd1080</option> 
    <option>highres</option> 
</select> 

を使用し、品質セレクタですメートルまだYouTubeのAPIのでは初心者が、このコードはmy personal Youtube Library

0123でのライブです

私のコードは少し厄介ですが、あなたがページを検査し、JSを閲覧することを歓迎しているので、どのような方法で難読化されていない、それはまだ行く方法があります。