javascript - 何度も発生するバックボーン イベント

Question

Model一連のフォーム要素 (入力チェックボックス、テキストエリア) をレンダリングするサブビューに関連付けられた EditorView サブビューがあります。

私の ListView は、唯一のEditor サブビューを作成します。new EditorView(model: this.model). render();ListView は、 ListView 内の項目をクリックして EditorView を作成し ます。

それはうまくいきます。

ただし、イベントがエディターのサブビューに関連付けられている場合

  // Bind to all properties in the view
  events: {
     "click input.isactive":  "editActive"
  },

イベントは複数回発生します...以前に読み込まれた EditorViews ごとに 1 回。あたかも多くの html がまだ存在しているかのように。ただし、(Firefox で) DOM を確認すると、1 つの EditorView の html のみが表示されます。

私は EditorView で .html(string) を使用しています。これは、「el」要素内の以前の html を置き換えると考えていました。

     var compiledTemplate = _.template( Template, data ); // Merge model with template
     this.$el.html( compiledTemplate );  // replace the previous html if any. ?? OR NOT!! SOAD

ありがとう

エディタービュー

  el: ".editor",

  tagName: "ul",

  className : "striped",

  events: {
     "click .isactive":  "editActive"
  },

  render : function() {

     var data = {
       item: this.model,
       _: _ 
     };

     var compiledTemplate = _.template( Template, data ); // Merge model with template
     this.$el.empty().html( compiledTemplate );  // replace the previous html 
     return this;
  },


  editActive: function(e) {
        e.preventDefault();
        var x = this.$('.isactive').prop('checked'); // property of input checkbox
        alert('click'+x);

        var y = this.model.set('Active', x);
  }