Can not rebind scroll event?

Question

I want to rebind window scroll event in ajax call

$(window).scroll(function(){
   column_height = $("#first_column").height();
   screenTop = $(window).scrollTop();
   window_height = $(window).height();

if((screenTop+window_height)>=column_height){

    $(window).unbind('scroll');


      $.ajax({
            url: "/service/article_json.php",
            type: 'GET',
            async: false,
            cache: false,
            timeout: 30000,
            error: function(){
                return true;
            },
            success: function(data){ 
                $.each($.parseJSON(data), function(key,item) {

                  //Add content to #first_column

                  $(window).bind('scroll');

                });
            }
        });
  }
});

The $(window).bind('scroll'); seems not working.

Answer 1

When you .unbind a reference to the bound event is not stored anywhere or anything. $(window).bind('scroll') actually does nothing.

First off, if you are using 1.7 you should use .on and .off instead. Not a big deal.

There are several ways to do this, but the easiest is to just define the function separately and use its name to bind/unbind. You can even attach it to the window (though I think just using the function keyword does that. Anyway..)

$(window).data('scrollEvent', function() { /* your func here */ });
$(window).on('scroll', $(window).data('scrollEvent'));

You can use that second line to replace $(window).bind('scroll') above. Beware of the recursion.