我正在與backbone.js進入一個盲點。我寫了這段代碼，我試圖做的就是獲得測試div在按鈕單擊時呈現。如果我在initialize()函數內調用render()，它會渲染。但是，我從不觸發render()函數來響應點擊事件。Backbone.js/Coffeescript - 映射簡單的點擊事件

我錯過了什麼？

謝謝！

HTML集裝箱

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset='utf-8' /> 
    <!--/Always force latest IE rendering engine (even in intranet) & Chrome Frame --> 
    <meta content='IE=edge,chrome=1' /> 
    <meta http-equiv='X-UA-Compatible' /> 
    <link type="text/css" rel="stylesheet" href="/stylesheets/site.css" media="screen" /> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
    <script type="text/javascript" src="/javascripts/underscore-min.js"></script> 
    <script type="text/javascript" src="/javascripts/backbone-min.js"></script> 
    <script type="text/javascript" src="/javascripts/application.js"></script> 
    <script type="text/javascript" src="/javascripts/sample_data.js"></script> 
    <title>The Middleman!</title> 
    </head> 
    <body class='page_classes'> 
    <div id='main' role='main'> 
     <h1>The Middleman is watching.</h1> 
     <div id='band-app'> 
     <button id='new-band'>new band</button> 
     </div> 
    </div> 
    </body> 
</html>

CoffeeScript的簡單視圖

SAMPLE_TEMPLATE = """ 
<div id="my-fine-id"> 
    My fine id!!! 
</div> 
""" 

$ -> 
    class AppView extends Backbone.View 
    render: -> 
     console.log "rendering" 
     @template = _.template SAMPLE_TEMPLATE, {} 
     @el.html @template 

    initialize: -> 
     console.log "constructing" 
     @el = $('#band-app') 
     @events = {"click button#new-band": "render"} 

    app = new AppView()

來源

2011-11-25 Steve Ross

我覺得delegateEvents，其中規定了事件處理，被稱爲在View構造，initialize之前調用，所以要麼調用它明確地在您的initialize方法中（在您設置了events地圖之後），或者確保events地圖設置爲構建的一部分類本身，請參閱：

http://documentcloud.github.com/backbone/#View-extend

來源

2011-11-25 19:25:14

謝謝！我使用'constructor：'函數，但切換到'initialize：'以便讓Backbone構造。在'initialize：'中分配事件哈希後立即調用'@delegateEvents（）'解決了這個問題。 –

馬呂斯說什麼是正確的。

通常，您希望在類定義中指定events，而不是在初始化程序中。實際上，對於此示例，您根本不需要initialize函數：

class AppView extends Backbone.View 

    events: 
    'click button': 'render' 

    render: -> 
    @$el.html _.template SAMPLE_TEMPLATE, {} 

$ -> 
    new AppView el:$('#band-app')

來源

2012-06-28 00:31:09 Matt

而另一半的問題是他正在'initialize'中更改'@ el'，在較新的Backbone中他應該使用['setElement']（http://documentcloud.github.com/backbone/#View-setElement ）（在'@ events'設置之後）。 –

Backbone.js/Coffeescript - 映射簡單的點擊事件

CoffeeScript的簡單視圖

回答

相關問題