2016-04-05 69 views
0

Her birinde 1 Youtube videosu bulunan 3 sürgü var.Javascript, sayfayı yeniledikten sonra çalışmıyor - NEDEN?

Her videoda özel START/STOP javascript düğmeleri bulunur.

Komutum, sayfa ilk kez yüklendiğinde mükemmel çalışır. Yenilemeden sonra, javascript düğmeleri artık çalışmıyor. Aslında, önbelleği temizleyene ve hatta tarayıcıyı yeniden başlatmaya bile gerek kalmayacaklar.

Her ipucu için teşekkür ederiz!

// START STOP YOUTUBE VIDEO 
 

 
    \t // Inject YouTube API script 
 
\t  var tag = document.createElement('script'); 
 
\t  tag.src = "//www.youtube.com/player_api"; 
 
\t  var firstScriptTag = document.getElementsByTagName('script')[0]; 
 
\t  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 
 
    
 
    // Set global variable for the player 
 
     var playerA; 
 
     var playerB; 
 
     var playerC; 
 

 
    // this function gets called when API is ready to use 
 
\t  function onYouTubePlayerAPIReady() { 
 
\t  
 
\t  // create the global player from the specific iframe (#video) 
 
\t  
 
\t  // for Slider 1 
 
\t \t   playerA = new YT.Player('player1', { 
 
\t \t   events: { 
 
\t \t    // call this function when player is ready to use 
 
\t \t    'onReady': onPlayerReady 
 
\t \t   } 
 
\t \t   }); 
 

 
\t  // for Slider 2 
 
\t \t   playerB = new YT.Player('player2', { 
 
\t \t   events: { 
 
\t \t    // call this function when player is ready to use 
 
\t \t    'onReady': onPlayerReady 
 
\t \t   } 
 
\t \t   }); 
 

 
\t  // for Slider 3 
 
\t \t   playerC = new YT.Player('player3', { 
 
\t \t   events: { 
 
\t \t    // call this function when player is ready to use 
 
\t \t    'onReady': onPlayerReady 
 
\t \t   } 
 
\t \t   }); 
 
\t  
 
\t  }; 
 

 
\t // Bind Events 
 
\t  function onPlayerReady(event) { 
 
\t  
 
\t \t  // bind Slider 1 events 
 

 
\t \t  var playButton = document.getElementById("VideoPlayBtn1"); 
 
\t \t  playButton.addEventListener("click", function() { 
 
\t \t   playerA.playVideo(); 
 
\t \t  }); 
 
\t \t  
 
\t \t  var pauseButton = document.getElementById("VideoPauseBtn1"); 
 
\t \t  pauseButton.addEventListener("click", function() { 
 
\t \t   playerA.pauseVideo(); 
 
\t \t  }); 
 

 

 
\t \t  // bind Slider 2 events 
 
\t \t  
 
\t \t  var playButton = document.getElementById("VideoPlayBtn2"); 
 
\t \t  playButton.addEventListener("click", function() { 
 
\t \t   playerB.playVideo(); 
 
\t \t  }); 
 
\t \t  
 
\t \t  var pauseButton = document.getElementById("VideoPauseBtn2"); 
 
\t \t  pauseButton.addEventListener("click", function() { 
 
\t \t   playerB.pauseVideo(); 
 
\t \t  }); 
 

 
\t \t  // bind Slider 3 events 
 
\t \t  
 
\t \t  var playButton = document.getElementById("VideoPlayBtn3"); 
 
\t \t  playButton.addEventListener("click", function() { 
 
\t \t   playerB.playVideo(); 
 
\t \t  }); 
 
\t \t  
 
\t \t  var pauseButton = document.getElementById("VideoPauseBtn3"); 
 
\t \t  pauseButton.addEventListener("click", function() { 
 
\t \t   playerB.pauseVideo(); 
 
\t \t  }); 
 
\t \t  
 
\t \t };
<iframe id="player1" class="VideoA" src="https://www.youtube.com/embed/C0DPdy98e4c?enablejsapi=1&showinfo=0" frameborder="0" allowfullscreen="0"></iframe> 
 

 
<button id="VideoPlayBtn1" >Play</button></div> 
 
<button id="VideoPauseBtn1">Pause</button></div> 
 

 
<iframe id="player1" class="VideoA" src="https://www.youtube.com/embed/C0DPdy98e4c?enablejsapi=1&showinfo=0" frameborder="0" allowfullscreen="0"></iframe> 
 

 

 
<button id="VideoPlayBtn2" >Play2</button></div> 
 
<button id="VideoPauseBtn2">Pause2</button></div> 
 

 
<iframe id="player3" class="VideoA" src="https://www.youtube.com/embed/C0DPdy98e4c?enablejsapi=1&showinfo=0" frameborder="0" allowfullscreen="0"></iframe> 
 

 
<button id="VideoPlayBtn3" >Play3</button></div> 
 
<button id="VideoPauseBtn3">Pause3</button></div>

+0

bakın. –

+0

Tamam, sorunu çözdüm. "// Inject YouTube API komut dosyası" bitinin ayrı bir komut dosyasına yerleştirilmesi ve daha sonra yüklenmesi gerekiyordu. – James

cevap

-1

Sen (java komut

kullanın location.reload aşağıdaki kodu uygulayarak sayfayı yenileyebilirsiniz); yöntem. Daha fazla bilgi için

Kişisel kod parçacığı da çalışmıyor this