Javascript 在Backbone.js事件中实现切换

我想在主干网中实现一个可逆的动画，就像在jquery中一样：

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

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

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

doToggle : function() { ??? }

---

要在接收事件的视图中切换的元素是否为？如果是：

doToggle: function() {
  this.$("a.contact").toggle()
}

---

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

Backbone.View.extend({

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

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

});

---

实际上，我相信使用

事件

来实现这一点的唯一方法是添加

触发器

，以保持实际的流在一起。老实说，以这种方式使用切换似乎有点笨拙

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;
  }

});

---

我一直在寻找解决这个问题的办法，我只是用老式的方式来解决。我还希望能够从我的应用程序的其他视图中找到我的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();

---

您可以对此进行优化，因为doToggle发生在单击过程中。你得到了

event.target

作为click so的目标元素

toggle:function（ev）{$（ev.target）.toggle（）}

应该可以了，谢谢@Derick Bailey！我想我可以这样做，但我没有想到使用currentTargetI，我不相信这是正确的@Derick。jQuery的两个参数切换将向e.currentTarget添加一个click事件处理程序，该处理程序将在偶数/奇数单击时调用这些函数。如果你使用这个，每次点击a.contact，就会再次添加新的处理程序。不知道我当时在想什么，我回答说：PYep@DerickBailey，这不能像预期的那样正常工作。多个点击处理程序被激活。这工作完美无瑕。被接受的答案至少对我来说不太合适，因为我在同一个类中运行了多个切换事件。