JQuery unbind (прокрутка) функция не работает

Question

Согласно документации JQuery, это должно работать, но это не так.

Функция scrollHandler() вызывается, когда всплывающее окно отображается и должно быть уничтожено, если оно закрыто, однако отключение не работает. Если я делаю полный $ (window) .unbind ('scroll'), он действительно работает, но он открещивает другие элементы, связанные с событием прокрутки.

Код находится по адресу: http://codepen.io/nicotinell/pen/dogJGJ. Происхождение события прокрутки происходит между строками 23 и 44, чтобы сэкономить пару секунд.

Demo (где печенье на самом деле работает) находится по адресу: http://codepen.io/nicotinell/full/dogJGJ/

/* Crate Slug */ 
    function convertToSlug(text) { 
     return text 
     .toLowerCase() 
     .replace(/[^\w ]+/g,'') 
     .replace(/ +/g,'-'); 
    } 

    /**/ 
     function handleEyeCatcher(slug){ 
      console.log($.cookie()); 
      console.log(slug); 
      /* If not set, create default cookie */ 
      if(!$.cookie(slug)) { 
       $.cookie(slug, 'true', { expires: 7 }); 
       $('#eye-catch').addClass('visible'); 
      } 

      /* Status */ 
      var status = $.cookie(slug); 
      console.log(status); 

      /* Scroll Function */ 
      function scrollHandler() { 
       var height = $(window).height(); 
       if ($(this).scrollTop() > height) { 
        $('#eye-catch').removeClass('invisible'); 
        $('#eye-catch').addClass('visible'); 
       } else { 
        $('#eye-catch').removeClass('visible'); 
        $('#eye-catch').addClass('invisible'); 
       } 
      } 
      /* Hide/show element depending on cookie */ 
      if(status == 'true'){ 
       console.log('it is opened'); 
       $(window).bind('scroll', scrollHandler); 
      } else { 
       $(window).unbind('scroll', scrollHandler); 
       console.log('it is closed'); 
       $('#eye-catch').removeClass('visible'); 
       $('#eye-catch').addClass('invisible'); 
      } 
     } 
    $(document).ready(function(){ 
     /* Get raw slug */ 
      var rawSlug= $('#eye-catch .title').text(); 
     /* Convert to cookie name friendly slug */ 
      var slug = convertToSlug(rawSlug); 

     handleEyeCatcher(slug); 

     /* Hide and update cookie on click */ 
     $('#eye-catch .close').on('click', function(){ 
      $.cookie(slug, 'false', { expires: 7 }); 
      handleEyeCatcher(slug); 
     }); 

     /* Revert action */ 
     $('#revert').on('click', function(){ 
      $.cookie(slug, 'true', { expires: 7 }); 
      handleEyeCatcher(slug); 
     }); 
    }); 

Answer 1

Как написано function scrollHandler() {...} определяется заново каждый раз, когда handleEyeCatcher() называется.

Таким образом, .unbind('scroll', scrollHandler) гарантирован только для просмотра экземпляра этой функции, определяемого правилами закрытия.

Попробуйте переместить scrollHandler() снаружи handleEyeCatcher(), then unbind('scroll', scrollHandler) будет гарантированно увидеть только один и только scrollHandler.