Установка глобальной переменной области видимости внутри функции

Question

Я пытаюсь настроить триггеры анимации на основе высоты элемента. Проект построен с помощью AngularJS, но проблема, с которой я столкнулась, кажется действительно безумной. Я пытаюсь установить переменную imgH при загрузке изображения. Внутри моей функции onload журнал возвращает правильную высоту изображения и задает глобальную переменную imgH. После моей функции OnLoad команда журнала консоль возвращается imgH = неопределенные

var imgH; 
     $('.step-image').on('load',function(){ 
      imgH = $(this).height(); 
      console.log(imgH); 
     }); 
console.log(imgH); 

Answer 1

Переменная является получать набор, это просто не еще набор, когда вы делаете что console.log в конце.

Вот последовательность, в которой ваш код работает:

1. var imgH; - Создает глобальный с начальным значением undefined.
2. $('.step-image').on('load', function ...) - Устанавливает обработчик, не вызывает (пока) функцию.
3. console.log(imgH); (внизу) - показывает undefined, потому что ничего не присвоил значение imgH.
4. Позже, когда изображение загружается, вызывается функция обработчика и устанавливает imgH.
5. console.log(imgH); (внутри функции обработчика) - показывает значение.