Question

我一直在寻找大约2个小时的时间，并且找不到任何生病的问题。

我正在尝试我第一次使用Backbonejs，我正在尝试进行ajax调用并处理结果。我知道这可能不是应该使用的功能模型，但我只是尝试一下，在其他情况下如何使用它。

var Login = Backbone.Model.extend({
    url: WEBSITE_PATH+'login',
});
var loginView = Backbone.View.extend({
    events:{
        'submit form': 'login'
    },

    login: function(e){
        e.preventDefault();
        this.model.save({
            username: $(e.currentTarget).find('#username').val(),
            password: $(e.currentTarget).find('#password').val()
          }, {
            success: this.onSuccess,
            error: this.onError
        });
    },

    onSuccess: function(model, response){
        console.log(this); //Returns Window object
        // - - - - - ^ -> I need view object in order to get the $el and show result
    }
}
$(document).ready(function(){
    var login = new Login();
    new loginView({ el: $('#loginForm'), model: login });
});

在模型对象中，没有参考视图。我可以全局搜索页面以显示我的结果，但这违背了使用主干的目的。

目标：在onSuccess中执行$(this.el).find('#result_message').html(response.message)之类的操作

我是否以错误的方式看待这个问题，我是否应该这样做，或者是否有办法获取视图对象？

Answer 1

您可以使用jQuery proxy函数。

success: $.proxy(this.onSuccess, this)

Answer 2

有一些解决这个问题的方法......

_.bindAll ...

var LoginView = Backbone.View.extend({
    events:{
        'submit form': 'login'
    },

    initialize: function() {
        _.bindAll(this, 'onSuccess');
    },

    login: function(e){
        e.preventDefault();
        this.model.save({
            username: $(e.currentTarget).find('#username').val(),
            password: $(e.currentTarget).find('#password').val()
          }, {
            success: this.onSuccess,
            error: this.onError
        });
    },

    onSuccess: function(model, response){
        console.log(this);
    }
});

_.bind ...

var LoginView = Backbone.View.extend({
    events:{
        'submit form': 'login'
    },

    login: function(e){
        e.preventDefault();
        this.model.save({
            username: $(e.currentTarget).find('#username').val(),
            password: $(e.currentTarget).find('#password').val()
          }, {
            success: _.bind(this.onSuccess, this),
            error: _.bind(this.onError, this)
        });
    },

    onSuccess: function(model, response){
        console.log(this);
    }
});

收听模型的change事件......

var LoginView = Backbone.View.extend({
    events:{
        'submit form': 'login'
    },

    initialize: function() {
        this.listenTo(this.model, 'change', this.onSuccess);
    },

    login: function(e){
        e.preventDefault();
        this.model.save({
            username: $(e.currentTarget).find('#username').val(),
            password: $(e.currentTarget).find('#password').val()
          }, {
            success: this.onSuccess,
            error: this.onError
        });
    },

    onSuccess: function(model, response){
        console.log(this);
    }
});

任何这些都应该为你做到！

Backbonejs在保存成功处理程序中获取视图

2 个答案: