1

ページに既にレンダリングされている 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>

私の見解（コーヒースクリプト）：

class MyApp.Views.ExampleView extends Backbone.View

  el: $('#myElement')

  initialize: ->
    console.log 'initialized'

  events:
    'click #myButton': 'alertMe'

  alertMe: ->
    alert('hello!')

私は何を間違っていますか？

4

1 に答える 1

2

@muistooshortと@JayCのおかげで、イベントがバインドされなかった理由は、ドキュメントの準備が整う前にビューが定義されていたため（そしてel、要素が実際にレンダリングされる前に定義されていたため）であることがわかりました。これを修正するには、ドキュメントの準備ができた後にビューを定義するか、ビューがインスタンス化されたときにオプションとして要素を渡すことができます。

<script>
  new MyApp.Views.ExampleView({el: $('#myElement')})
</script>

または、セレクターを文字列として指定すると、正しく機能します。

class MyApp.Views.ExampleView extends Backbone.View

  el: '#myElement'
于 2013-02-03T06:11:25.497 に答える