Why audio events are not firing with BackboneJS but others are?

Question

I don\'t understand why the click events are firing ok but not the timeupdate one.

No event is firing from , I tr

Answer 1

Backbone internally converts the events object and binds the events by delegation. This means that

events: {
        'timeupdate .audio': 'onTimeUpdate',
        'click .btn_play': 'onClickPlay'
}

ends as

this.$el.delegate('.audio','timeupdate', this.onTimeUpdate);
this.$el.delegate('.btn_play','click', this.onClickPlay);

But there's a catch:

Uses event delegation for efficiency. [...] This only works for delegate-able events: not focus, blur, and not change, submit, and reset in Internet Explorer.

And it would appear that audio events are not delegate-able.

However, setting directly the callbacks does work, for example you could replace your initialize function by

initialize: function() {
    this.$el.html(this.template(this.model.toJSON()));
    _.bindAll(this,'onTimeUpdate');
    this.$('.audio').on('timeupdate', this.onTimeUpdate);
}