javascript - 在 backbone.js 中获取动态事件 ID

Question

我是第一次接触 backbone.js，也是 MVC 的新手。

此示例代码创建了一个列表，每个列表都有一个类为 updateTotal 的 anchor 。我可以使用 click a.updateTotal':'updateVar' 事件成功调用 updateVar 函数

我的问题是如何获取被点击 anchor 的ID？通常在 jQuery 中我使用类似 $(this).attr("id"); 的东西。获取被点击元素的 ID。

谢谢!

我的代码....

(function($){
   var Item = Backbone.Model.extend({
    defaults: {
     itemName: 'Item Name',
     itemCount: 0 
   }
});

var List = Backbone.Collection.extend({
 model: Item
});



var ListView = Backbone.View.extend({    

  el: $('body'), // attaches `this.el` to an existing element.

  events: {
    'click button#addItem': 'addItem',
    'click a.updateTotal':'updateVar'
  },

  initialize: function(){
    _.bindAll(this, 'render', 'addItem', 'appendItem', 'updateVar');

    this.collection = new List();
    this.collection.bind('add',this.appendItem);
    this.collection.bind('updateVar',this.updateVar);

    this.counter=0; //total added so far
    this.render();
  },

  render: function(){
    $(this.el).append('<button id="addItem">Add item</button>');
    $(this.el).append('<ul></ul>');
    _(this.collection.models).each(function(item){
     appendItem(item);
    }, this);
  },

  addItem: function(){
    this.counter++;
    var item = new Item();
    item.set({
      itemName: 'Item '+this.counter,
      itemID: 'item'+this.counter
    });
  this.collection.add(item);
  },

  appendItem: function(item){
    $('ul', this.el).append("<li>"+item.get('itemName')+" (<span id=\""+item.get('itemID')+"-counter\">"+item.get('itemCount')+"</span>) <a class=\"updateTotal\" id=\"update-"+item.get('itemID')+"\">[update]</a></li>");
  },

  updateVar: function(){
     //------------------------------------
     //I want to get the ID to use here
     //------------------------------------
  }

});

 // **listView instance**: Instantiate main app view.
 var listView = new ListView();      
})(jQuery);

Answer 1

backbone 中的 events 在后台使用 jquery。您可以向事件处理程序方法提供一个 eventArgs 参数，并从中获取 currentTarget，就像任何其他 jquery 回调一样:

updateVar: function(e){
  var clickedEl = $(e.currentTarget);
  var id = clickedEl.attr("id");
}