Объявите глобальную переменную внутри функции

Question

У меня есть следующий код, необходимый для отслеживания встроенного Youtube видео в моей странице с использованием их Javascript API:

function onYouTubePlayerReady(playerId) { 
     var youtubeplayer = document.getElementById('youtubeplayer'); 
     youtubeplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
     youtubeplayer.setPlaybackQuality('large'); 
     } 

function onytplayerStateChange(newState) { 
    //Make it autoplay on page load 
    if (newState == -1) { 
     youtubeplayer.playVideo(); 
     } 

    var tiempo = youtubeplayer.getCurrentTime(); 
    //Rounds to 2 decimals 
    var tiempo = Math.round(tiempo*100)/100; 
    alert(tiempo); 
    } 

(деталей, относящихся к API Youtube не важно, но если вам интересно, они находятся на моем предыдущем вопросе Youtube Javascript API: not working in IE).

Теперь моя проблема в том, что функция onYoutubePlayerReady() объявляет «youtubeplayer», которая является ссылкой на объект DOM, и мне нужно получить доступ к этой переменной из другой функции onytplayerstateChange() тоже ... но «youtubeplayer "объявляется как локальная переменная. Это работает в IE 8, Safari ..., но не работает в Firefox 12. Конечно, я мог бы получить ссылку на «youtubeplayer» следующим образом вместо этого, без «вар»:

youtubeplayer = document.getElementById('youtubeplayer'); 

И на самом деле так выглядит код примера Youtube, но если я напишу его таким образом, код не будет работать в IE 8 (хотя он работает в Firefox 12, см. Мой предыдущий вопрос для получения дополнительной информации).

... Все это приводит меня к: есть способ объявить глобальную переменную изнутри функции (например, «youtubeplayer» выше), так что к ней могут быть доступны и другие функции? Что-то, что работает во всех браузерах?

Answer 1

Другой способ объявить глобалам заключается в создании в качестве дополнительного имущества глобального «окна» object-- так что

window.youtubeplayer = document.getElementById('youtubeplayer'); 

Это должно быть доступным для всего на этой странице. Таким образом, ваш полный код будет выглядеть так:

function onYouTubePlayerReady(playerId) { 
    window.youtubeplayer = document.getElementById('youtubeplayer'); 
    window.youtubeplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
    window.youtubeplayer.setPlaybackQuality('large'); 
} 

function onytplayerStateChange(newState) { 
    //Make it autoplay on page load 
    if (newState == -1) { 
    window.youtubeplayer.playVideo(); 
    } 

    var tiempo = window.youtubeplayer.getCurrentTime(); 
    //Rounds to 2 decimals 
    var tiempo = Math.round(tiempo*100)/100; 
    alert(tiempo); 
} 

Answer 2

Вместо того, чтобы передать ссылку строку в вашу функцию onytplayerStateChange для слушателя событий, вы можете создать обработчик событий в готовой функции и передать непосредственно, например, так:

function onYouTubePlayerReady(playerId) { 
    var youtubeplayer = document.getElementById('youtubeplayer'); 
    var stateChangeHandler = function (newState) { 
     //Make it autoplay on page load 
     if (newState == -1) { 
      youtubeplayer.playVideo(); 
     } 
     var tiempo = youtubeplayer.getCurrentTime(); 
     //Rounds to 2 decimals 
     var tiempo = Math.round(tiempo*100)/100; 
     alert(tiempo); 
    }; 
    youtubeplayer.addEventListener("onStateChange", stateChangeHandler); 
    youtubeplayer.setPlaybackQuality('large'); 
} 

или даже передать в анонимной функции непосредственно:

function onYouTubePlayerReady(playerId) { 
    var youtubeplayer = document.getElementById('youtubeplayer'); 
    youtubeplayer.addEventListener("onStateChange", function (newState) { 
     //Make it autoplay on page load 
     if (newState == -1) { 
      youtubeplayer.playVideo(); 
     } 
     var tiempo = youtubeplayer.getCurrentTime(); 
     //Rounds to 2 decimals 
     var tiempo = Math.round(tiempo*100)/100; 
     alert(tiempo); 
    }); 
    youtubeplayer.setPlaybackQuality('large'); 
} 

Это сохраняет объем переменной youtubeplayer внутри функции «onYouTubePlayerReady» и обходит необходимость для создания глобальной переменной.