0 
var foo = Backbone.View.extend({    
  tagName: 'div',
  className: 'unselected',
  events: {
    'click div' : 'select'
  },  
  initiate: function () {
    ._bindall(this, 'render' , 'select' );    
    this.render();
  },
  render: function () {
    $(this.el).html(_.template($("#template").html(),{...});
    return this;
  },
  select: function () {
    if ( this.className == 'selected' ) {
      this.className = 'unselected';
    }
    else {
      this.className = 'selected';
    }
    this.render();
  }
});

この div ボックスをクリックすると、className は正しく更新されますが、html は更新されません。したがって、ビューの className は「selected」に変更されますが、Web ページの div ボックス要素を調べると、「class="unselected」と表示されます。クリックしたときにhtmlも更新したいと思います。

アドバイスやチュートリアル/ドキュメントへのリンクをいただければ幸いです。

4

2 に答える 2

1

Backbone.Viewは単なる便利なプレースホルダーであり、実際のDOMElementではありません。this.elこれらの線に沿って何かを行うことによって更新する必要があります：

select: function () {

  if ( this.className == 'selected' ) {
    this.className = 'unselected';
  }
  else {
    this.className = 'selected';
  }
  this.el.className = this.className;
  this.render();
}
于 2012-07-11T21:20:47.433 に答える
1

あなたがしたいことは、これを行うために el セレクター自体で作業し、チェーンされた jquery toggleClass 呼び出しを使用することです。すべてを 1 行で実行できます。

select : function() {
    this.$el.toggleClass('selected').toggleClass('unselected');
}

早くて簡単...

于 2012-07-12T00:18:59.123 に答える