2012-06-01 3 views
4

클릭하면 중첩 된 백본보기에서 작업하면서 동일한보기의 새 인스턴스를 만듭니다. 모든 이벤트가 아닌 특정 이벤트 만 비활성화하고 싶습니다. 이 경우 클릭하십시오. undelegateEvents()를 사용하여 시도했지만 모든 기능이 비활성화됩니다. 어떻게 할 수 있을지에 대한 아이디어가 있습니까?Backbone.js보기에서 특정 이벤트 사용 안 함

var View = Backbone.View.extend({ 
    events: { 
     "mousedown": "start", 
     "mouseup": "over" 
    }, 

    start: function() { 
     var model = this.model; 

     var v = new View({ 
      model: model, 
     }); 
     v.undelegateEvents(); //I just want to disable mousedown 
     v.render(); 
    }, 

    over: function() { 
     /* 
     some code here 
     */ 
    }, 

    render: function() { 
     /* 
     some code here 
     */ 
    } 
}); 

아이디어는 다른 이벤트를 유지하면서 두 번째 인스턴스보기에서 클릭을 금지하는 것입니다 : 여기

내가 작업하고있는 코드 조각이다. 첫 번째 이벤트에는 모든 이벤트가 있습니다.

감사

당신이 delegateEvents를 호출 할 때

답변

7

당신은 당신이 사용하고자하는 이벤트를 지정할 수 있습니다

delegateEventsdelegateEvents([events])

가 내 DOM 이벤트에 대한 선언 콜백을 제공하기 위해 jQuery의 delegate 기능을 사용하여 전망. 이벤트 해시가 직접 전달되지 않으면 this.events을 원본으로 사용합니다.

그래서 당신이 뭔가를 할 수 있습니다 :

var v = new View({ 
    model: model, 
}); 
v.undelegateEvents(); 
var e = _.clone(v.events); 
delete e.mousedown; 
v.delegateEvents(e); 
v.render(); 

당신은 비록보기에하는 방법으로 그 논리를 밀어 할 수 있습니다 :

detach_mousedown: function() { 
    this.undelegateEvents(); 
    this.events = _.clone(this.events); 
    delete this.events.mousedown; 
    this.delegateEvents(); 
} 

//... 

v.detach_mousedown(); 

을 당신은 실수 피하기 위해 this.events = _.clone(this.events) 속임수가 필요합니다 "클래스의"events (예 : this.constructor.prototype.events)을 하나의 객체에 대해서만 변경하려는 경우이를 변경합니다. 또한 내부에 유사한 일을 할 것 View 생성자에 대한 플래그를 가질 수는 initialize :

initialize: function() { 
    if(this.options.no_mousedown) 
     this.detach_mousedown() 
    //... 
} 

또 다른 옵션은 mousedown 핸들러없이 기본 뷰가 다음을 가지고보기에 그 연장하는 것 mousedown 핸들러 :

var B = Backbone.View.extend({ 
    events: { 
     "mouseup": "over" 
    }, 
    //... 
}); 
var V = B.extend({ 
    events: { 
     "mousedown": "start", 
     "mouseup": "over" 
    }, 
    start: function() { /* ... */ } 
    //... 
}); 

당신은 주위의 속성을 병합하지 않습니다 events_.extend로 수동 extend으로 B.eventsV 내부 또는 혼란을 복제해야 할 것이다, 그것은 단지 물건을 도매로 대체합니다.

+0

감사 백본보기 내 undelegate 이벤트가,이 잘 작동하는 방법을 보여줍니다 간단한 예입니다. 또한 추가 설명을 주셔서 감사합니다.이 답변에 도움이되는 정보를 얻었습니다. – rpabon

1

다음은 위임 또는이 멋진 답변 @mu에 대한

Backbone.View.extend({ 

    el: $("#some_element"), 

    // delete or attach these as necessary 
    events: { 
     mousedown: "mouse_down",  
     mousemove: "mouse_move", 
     mouseup: "mouse_up", 
    }, 

    // see call below 
    detach_event: function(e_name) { 
     delete this.events[e_name] 
     this.delegateEvents() 
    }, 

    initialize: function() {   
     this.detach_event("mousemove")  
    }, 

    mouse_down: function(e) {  
     this.events.mousemove = "mouse_move" 
     this.delegateEvents()  
    }, 

    mouse_move: function(e) {}, 

    mouse_up: function(e) {} 

})