Я хочу, чтобы вызвать событие один раз, когда прокручивается в поле зрения с помощью jQuery

Question

Я работаю над этим небольшим кодом:

$(window).scroll(function(){
  var scrollTop = $(window).scrollTop(),
      windowHeight = $(window).height(),
      elem = $('#coverage-area-load-trigger').offset().top,
      final = elem - windowHeight,
      distance = final - scrollTop;
  if(distance < 0){
    console.log('Load Now');
  }
});

Как я должен написать это так, чтобы "Загрузить сейчас" был зарегистрирован только один раз?

Я собираюсь заменить журнал консоли "Загрузить сейчас" следующим:

$('#coverage-area').attr('src', 'https://www.google.com/maps/...');

Для запуска iframe "зона покрытия", чтобы загрузить, когда он появляется в поле зрения.

Спасибо за вашу помощь!

Answer 1

Просто добавьте переменную, которая проверяет, было ли событие инициировано следующим образом:

var coverageAreaTriggered = false;
$(window).scroll(function () {
  if (!coverageAreaTriggered ){
    var scrollTop = $(window).scrollTop(),
      windowHeight = $(window).height(),
      elem = $('#coverage-area-load-trigger').offset().top,
      final = elem - windowHeight,
      distance = final - scrollTop;
    if (distance < 0) {
      console.log('Load Now');
      coverageAreaTriggered = true;
    }
  }
});

Answer 2

Другой вариант заключается в использовании

$(window).on("scroll", function(){
  ...
  if(distance < 0){
    console.log("load now");
    $(window).off("scroll");
  }

});

Параметр off при вызове удаляет обработчик события. Таким образом, после срабатывания он удаляет себя.