5

我想在 Backbone 中实现一个可逆动画,就像我们在 jquery 中一样:

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

我的问题是如何在主干的事件语法中做到这一点?如何模仿功能,功能设置?

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

doToggle : function() { ??? }
4

4 回答 4

15

Backbone 的视图事件直接委托给 jQuery,并允许您通过回调方法访问所有标准 DOM 事件参数。因此,您可以轻松地在元素上调用 jQuery 的切换方法:


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()。我试图通过删除诸如渲染和初始化之类的内容来简化下面的代码,以使示例更加清晰。

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

我实际上相信这样做的唯一方法events是添加 atrigger以将实际流程保持在一起。老实说,必须以这种方式使用切换似乎有点笨拙。

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 回答