5

jquery で行うのと同じ方法で、Backbone にリバーシブル アニメーションを実装したいと思います。

$('a.contact').toggle(
function(){
    // odd clicks
},
function(){
    // even clicks
});

私の質問は、バックボーンのイベント構文でこれを行う方法ですか? 機能、機能設定を模倣するにはどうすればよいですか?

events : {
  'click .toggleDiv' : this.doToggle
},

doToggle : function() { ??? }
4

4 に答える 4

15

Backbone のビュー イベントは jQuery に直接委任し、コールバック メソッドを介してすべての標準 DOM イベント引数にアクセスできるようにします。したがって、要素で jQuery の toggle メソッドを簡単に呼び出すことができます。


Backbone.View.extend({

  events: {
    "click a.contact": "linkClicked"
  },

  linkClicked: function(e){
    $(e.currentTarget).toggle(
      function() {
        // odd clicks
      },
      function() {
        // even clicks
      }
    );
  }

});
于 2012-06-01T01:10:52.660 に答える
5

私はこの問題の解決策を探していましたが、昔ながらの方法で解決しました. また、アプリの他のビューから hideText() メソッドを見つけられるようにしたいと考えていました。

これで、他のビューから「showmeState」のステータスを確認し、目的に応じて hideText() または showText() を実行できるようになりました。例をより明確にするために render や initialize などを削除して、以下のコードを単純化しようとしました。

var View = Backbone.View.extend({
  events: {
    'click': 'toggleContent'
  },
  showmeState: true,
  toggleContent: function(){
    if (this.showmeState === false) {
      this.showText();
    } else {
      this.hideText();
    }
  },
  hideText: function() {
    this.$el.find('p').hide();
    this.showmeState = false;
  },
  showText: function() {
    this.$el.find('p').show();
    this.showmeState = true;
  }
});

var view = new View();
于 2013-07-16T22:49:36.753 に答える
0

イベントを受信するビュー内で切り替えたい要素はありますか？もしそうなら：

doToggle: function() {
  this.$("a.contact").toggle()
}
于 2012-06-01T00:29:23.733 に答える
0

私は実際にこれを行う唯一の方法は、実際の流れをまとめるためにeventsa を追加することだと信じています。triggerこのようにトグルを使わなければならないのは、正直言って少し不器用に思えます。

Backbone.View.extend({

  events: {
    "click .button": "doToggle"
  },

  doToggle: function(e){
    var myEle = $(e.currentTarget);
    $(e.currentTarget).toggle(
      function() {
        // odd clicks
      },
      function() {
        // even clicks
      }
    );
    myEle.trigger('click');
  }

});

おそらく使用するだけできれいです 

Backbone.View.extend({

  el: '#el',

  initalize: function() {
    this.render();
  },

  doToggle: {
    var myEle = this.$el.find('.myEle');
    myEle.toggle(
      function() {
        // odd clicks
      },
      function() {
        // even clicks
      }
    );
  },

  render: function(e){


    //other stuff

    this.doToggle();

   return this;
  }

});
于 2013-01-09T03:31:33.333 に答える