我正在尝试为已在页面上呈现的HTML片段创建视图。我可以看到视图正在实例化,但我无法绑定到任何事件。这是一个例子:
<html>
<head><!-- backbone, etc --></head>
<body>
<div id="myElement">
<button id="myButton">Click me</button>
</div>
<script>
new MyApp.Views.ExampleView()
</script>
</body>
</html>
我的观点(coffeescript):
class MyApp.Views.ExampleView extends Backbone.View
el: $('#myElement')
initialize: ->
console.log 'initialized'
events:
'click #myButton': 'alertMe'
alertMe: ->
alert('hello!')
我做错了什么?
答案 0 :(得分:2)
感谢@muistooshort和@JayC我意识到事件没有约束力的原因是因为我的视图是在文档准备好之前定义的(并且在元素实际定义之前定义el
渲染)。要解决此问题,您可以在文档准备好后定义视图,或者可以在实例化视图时将元素作为选项传递:
<script>
new MyApp.Views.ExampleView({el: $('#myElement')})
</script>
或者您可以将选择器指定为字符串,它将正常工作:
class MyApp.Views.ExampleView extends Backbone.View
el: '#myElement'