2011-10-03 6 views
0

버튼을 클릭하면 어떻게 이벤트가 시작됩니까?백본 js : 이벤트가 실행되지 않음

var test1 = new Test({ Name: "Test 1", id: 1 }); 
var test2 = new Test({ Name: "Test 2", id: 2 }); 
var test3 = new Test({ Name: "Test 3", id: 3 }); 
var tests = new TestCollection([test1, test2, test3]); 

TestView = Backbone.View.extend({ 
    initialize: function() { 
     this.render(); 
    }, 
    events: 
    { 
     "click .btn": "clickbtn" 
    }, 
    render: function() { 
     $("#tests_template").tmpl(tests.toJSON()).appendTo("#tests_list"); 
     this.delegateEvents(); 
     return this; 
    }, 
    clickbtn: function() { 
     alert('test'); 
    } 
}); 

var testView = new TestView(); 

<script id="tests_template" type="text/x-jquery-tmpl">  
    <li> 
    <b>${Name}</b><input type="button" id="btn" value="click" class="btn"/> 
    </li> 
</script> 

<ul id="tests_list"> 
</ul> 

답변

3

events 선언은보기의 el 요소와 함께 작동합니다. 지금 당장은 html 출력을 뷰의 el이 아닌 다른 것으로 직접 추가하는 코드가 있습니다.

이 그것을 수정합니다 :


TestView = Backbone.View.extend({ 
    initialize: function() { 
     this.el = $("#tests_list"); 
     this.render(); 
    }, 
    events: 
    { 
     "click .btn": "clickbtn" 
    }, 
    render: function() { 
     var html = $("#tests_template").tmpl(tests.toJSON()); 
     $(this.el).append(html) 
     return this; 
    }, 
    clickbtn: function() { 
     alert('test'); 
    } 
}); 
관련 문제