Question

Backbone scroll event will not fire. The click event and jquery attached scroll works. Here’s a fiddle as well: http://jsfiddle.net/cX2UV/

js

var TView = Backbone.View.extend({        
    events: {
        'scroll .content': 'loadMore',
        'click .code': 'codeClick'
    },

    loadMore: function() {
        this.$el.append('<p>backbone scrolling</p>');
    },

    codeClick: function() {
        this.$el.append('<p>clicking</p>');
    }
});

new TView({ el: '.target' });

$('.content').scroll(function(){ $('.target').append('jq scrolling...'); });

html

<div class="target">
<div class="content">
    <div>
        <span class="text">text</span>
        <span class="term">termmm</span>
        <span class="codes"><span class="code">12345</span></span>
    </div>
    <div>
        <span class="text">text</span>
        <span class="term">termmm</span>
        <span class="codes"><span class="code">12345</span></span>
    </div>  
</div>
</div>

css

body {margin:1em;}
.content {background:#EEE; height: 200px; overflow: scroll;}
.code{color:#00c}

Answer 1

When binding events to a view with a selector Backbone uses jQuery’s delegate. As noted in an answer to this question, the scroll event doesn’t bubble up so the handler can’t respond to it.