Question

我理解将事件处理程序附加到这样的视图：

events:{
  'a click':'mymethod'
}

但是，如果我想将点击事件附加到DOM中已有的内容，该怎么办？我没有视图，模型或任何东西的东西。

UDATED CODE ：

app.js：

(function() {

window.Team = {
Models: {},
Collections: {},
Views: {},
Router: {}
};

$(document).ready(function() {

var employees = new Team.Collections.Members();
employees.fetch({

data: { action: 'get_gdw_employees' },

success: function(collection, object, jqXHR){
  var allMembers = new Team.Views.AllMembers({collection: employees });
},

error: function(jqXHR, statusText, error) {
  console.log(error);
}
});

 var foo = new Team.Router.UIEvents();
 Backbone.history.start({pushState: true, root:"/about-us/meet-the-team/"});

 });

 })();

app.model.js

Team.Models.Member = Backbone.Model.extend({});

app.collections.js

Team.Collections.Members = Backbone.Collection.extend({
 model: Team.Models.Member,
 url: 'wp-admin/admin-ajax.php'
});

app.views.js

Team.Views.Member = Backbone.View.extend({

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

render:function(){
  this.$el.html( this.model.get('firstName'));
  return this;
}

});

Team.Views.AllMembers = Backbone.View.extend({

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

render:function(){
  this.collection.each(function(member){
    var employee = new Team.Views.Member({model:member});
  }, this);

 return this;
}

});

Answer 1

你可以这样做：

$('thatThingSelector').bind('click', function(){...});

<强> EDITED

从架构的角度来看，在基于Backbone的应用程序（SPA）中，每个交互都必须使用Backbone来实现，否则它将是一种新的意大利面：）。

如果您说您的页面中有一部分用户可以与之交互，那么听起来它应该包含在View中，因为View不一定需要它可能的模型，就像您的情况一样，应用程序的一些交互部分。

Answer 2

如果你想使用骨干来处理DOM事件，你需要将DOM的那部分附加到骨干视图。

将骨干视图附加到DOM的现有部分实际上非常容易。

标记

<div id="existing-element">
    <button id="my-button"/>
</div>

视图

var myView = Backbone.View.extend({

      el: '#existing-element',

      events:{
       'click #my-button' : 'onClick'
      },

      onClick: function(){
        //handle click event
      }
});

在DOM中已经在主干中附加事件处理程序

2 个答案:

标记

视图