2013-06-03 3 views
0

어떻게 하시겠습니까? 나는 SO를 검색했는데 하나의 유사한 결과를 찾았지만 작동하지 않습니다. 내가 "timeupdate"와 같은 행사에 무언가를 추가하는 경우backbone.js 오디오 이벤트에 바인딩

var Player = Backbone.Model.extend({ 
    defaults: { 
     //some variables 
    }, 
    //creating audio element 
    setAudio: function(ogglink, mp3link){ 
     //code, that works 
    } 
});  
var Playlist = Backbone.Collection.extend({ 
    model: Player 
}); 
var MyPlaylist = new Playlist([ 
    //some songs here 
]);  
var OneSongView = Backbone.View.extend({  
    //added some 'template' and 'el' code 
    initialize: function() { 
     this.model.bind("change", this.render, this); 
    }, 
    render: function (eventName) { 
     $(this.el).html(this.template(this.model.toJSON())); 
     this.model.setAudio(this.model.get("ogglink"), this.model.get("mp3link")); 
     return this; 
    }, 
    events: { 
     //declaration of some events 
    }, 
    //event functions 
});  
var AppRouter = Backbone.Router.extend({ 
    //router code 
});  
var app = new AppRouter(); 
Backbone.history.start(); 

: 여기

내 코드입니다 "somefunc"내가 here과 같은 코드를 추가하는 경우, 그것은 내가 오류를 hsve 것, 작동하지 않을 것입니다 :(

+0

아, 완전히 재건축하는 것을 기억하지 못한다. 그냥 작동하지 않거나 'this. $ ("audio")'는 함수가 아니다. 무언가가 그 것이다. –

+0

Ah ha! 이는 링크 된 예제 솔루션과는 달리,'render.'메소드가 실행될 때까지'this. $ el'의 HTML을 설정하지 않기 때문입니다. 그렇게하기 전까지는'this. $ ("audio")'에 이벤트 처리기를 연결할 수 없습니다. – idbehold

답변

2

모든 Backbone.View 이벤트 핸들러는 뷰의 el에 위임되어있다. 이것은 당신의 핸들러를 잡기 전에 뷰해야 거품 안에 발사 어떤 이벤트가/그 el까지 전파 있다는 것을 의미한다. 불행하게도

FO HTML5 오디오 및 동영상 요소는 대부분의 다른 요소와 마찬가지로 DOM을 통해 이벤트를 전파하지 않습니다. 이러한 이벤트를 처리하는 유일한 방법은 이벤트 컬렉션을 DOM에 삽입 한 후 <audio> 요소에 eventListeners를 직접 추가하는 것입니다.

관련 문제