0

我第一次玩backbone.js，但无法正确触发事件。有人可以解释我做错了什么吗？

非常感激！

在我的 html 底部加载的 app.js 中：

var Discussion = Backbone.Model.extend({
    defaults: {
        id: null,
        title: 'New discussion'
    },
    urlRoot: '/api/discussion'
});

var DiscussionCollection = Backbone.Collection.extend({
    model: Discussion,
    url: '/api/discussion'
});

var DiscussionView = Backbone.View.extend({   
   events: {
        'click .btnCreateDiscussion': 'create',
        'keypress #discussion_title': 'create'
   },

   initialize: function(){
        //this.$el = $("#form_discussion");
        this.template = _.template( $('#discussion-template').html() );
   },

   render: function(){
        console.log("rendering");
        return this;    
   },

   create: function(){
        console.log('creating a new discussion')
   }
});

var discussionView = new DiscussionView({ el: $("#form_discussion"), model: Discussion });

html:

<form action="" id="form_discussion" method="post">

<label for="discussion_title">Discussion Title</label>
<input type="text" id="discussion_title" name="discussion_title" />

<input class="btnCreateDiscussion" type="button" value="Create Discussion">


  <script type="text/template" id="discussion-template">
    <h1><%= title %></h1>
  </script>
4

3 回答 3

1

问题是jQuery。最新的 1.x 版本不起作用，但使用最新的 2.x 版本可以解决问题。如果有人能解释为什么在这种情况下我们应该只使用 2.x 会很有用？

于 2013-06-11T14:47:13.507 回答
1

它似乎工作正常：http: //jsfiddle.net/Jbahx/。（检查您的主干和下划线版本，并确保 DOM 已初始化）

关于你做错了什么：

  • model: Discussion实例化您的视图时。你必须给视图一个模型的实例，而不是一个类。如果你给视图一个模型（可选），通常是因为你想表示一个特定实例的数据。
  • 你的 render 方法永远不会被调用，但它目前没用，所以这不是什么大问题。
  • this.template = _.template( $('#discussion-template').html() );在initialize方法中。扩展时将其作为视图的属性，以便将其放入视图的原型中（即使这里看起来是单例）template: _.template( $('#discussion-template').html() ),：
于 2013-06-11T12:41:18.507 回答
-1

首先，您必须在覆盖的方法中调用 Backbone.View.prototype.initialize 以让 Backbone 初始化事件侦听器：

initialize: function(){
    //this.$el = $("#form_discussion");
    this.template = _.template( $('#discussion-template').html() );
    Backbone.View.prototype.initialize.call(this)
},

其次，在初始化时渲染视图——这不是最佳实践。用于这种单独的render方法。

于 2013-06-11T11:02:34.047 回答