Ничего не происходит, когда я инициирую событие с помощью Backbone

Я пытаюсь начать работу с Backbone. У меня есть следующий JS:

var Question = Backbone.Model.extend({
    defaults: function() {
        return {
          title: "Enter your question",
          type: "smallTextField",
          editMode: true
        };
      },

    initialize: function() {
          if (!this.get("title")) {
            this.set({"title": this.defaults.title});
          }
        },   

    toggleEditMode: function() {
        !this.get("editMode");
    },

    clear: function() {
        this.destroy();
      }         

});

Коллекция:

var Questions = Backbone.Collection.extend({
    initialize: function(models, options) {
        this.bind("add", options.view.addQuestionView);
    }
});

Вид приложения:

var AppView = Backbone.View.extend({
    el: $("body"),

    initialize: function () {
        this.questions = new Questions( null, { view: this });
    },

    events: {
        "click #addQuestion":  "addQuestionModel"
    },

    addQuestionModel: function() {
            var model = new Question();
            this.questions.add(model);
    },

    addQuestionView: function(model) {
        $("#questionBox").append("<div>" + model.get('title') + "</div>");  
    },

}); 

    var appview = new AppView;

и следующий HTML:

<div id="questionBox"></div>
<a href="#" id="addQuestion">Add question</a>

В моей спецификации Jasmine я запускаю $("#addQuestion").click();

Однако - ничего не происходит, когда я запускаю тест. Например. похоже, что ни одна функция не привязана к событию клика #addQuestion.

Я предполагаю, что что-то сделано не так, и я просто не могу понять, что это такое.

Есть идеи?


person Helge    schedule 07.06.2012    source источник
comment
У меня работает: jsfiddle.net/fguillen/6dT6N Надеюсь, у вас есть правильный HTML в вашем жасмин , я имею в виду, что ваш a#addQuestion правильно помещен в тег body, поэтому селектор events может соответствовать ему.   -  person fguillen    schedule 07.06.2012
comment
Я собираюсь отредактировать ваш вопрос, чтобы удалить весь код, добавляющий не более чем шум, нужна ли нам здесь реализация модели и коллекции?   -  person fguillen    schedule 07.06.2012


Ответы (2)


Почему у тебя # в id? Это опечатка? Попробуйте удалить его (id="addQuestion")

Кроме того, вы уверены, что инициализировали представление перед нажатием кнопки? Обычно, когда события не запускаются, это происходит потому, что они установлены для элемента, который находится вне области представления (например, для ссылки, не включенной в ваше представление "el"). Но поскольку вы используете тело, я не понимаю, как оно может появиться оттуда (если только вы не изменили его в своем посте). Поэтому я предполагаю, что ваш селектор jQuery здесь не очень полезен. Пытаться:

el: "body"

вместо:

el: $("body")
person Ronan    schedule 07.06.2012
comment
Просто опечатка появилась после того, как я немного изменил код, прежде чем публиковать его здесь. - person Helge; 07.06.2012

Обычно, когда у меня возникает эта проблема, это связано с тем фактом, что свойства литерала объекта, который вы передаете в представление Backbone, оцениваются до полной загрузки jQuery и DOM.

Вот отличный пост с описанием проблемы и несколькими решениями.

person Josh Earl    schedule 07.06.2012