在'bind'触发器中传递变量

时间:2012-02-02 12:23:20

标签: binding backbone.js

我正在使用带有jquery droppable的backbone.js。

我遇到的问题是,在进入.droppable函数时,'this'不再是指骨干对象。我读过Yehuda Katz关于理解'this'的文章,但我仍然不明白如何'解决'这个问题。 http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/

我认为解决问题的方法是绑定模型更改事件以触发方法,但我需要将变量传递给方法,我无法弄清楚如何做到这一点。

这是我的代码的摘录。在MyApp.User.Trigger('new_class');行,有没有办法添加变量?我如何把它放在绑定事件?

initialize: function(){
    user = MyApp.User;
    MyApp.User.bind('new_class',this.save, this);
    this.render();
},

render: function(){

    $('li.empty').droppable({

        hoverClass: "ui-state-active",
        start: function(e){
            $(this).click('unbind');
        },
        drop: function(event, ui){
            var add_class_to_user = $(this).attr('data-id');
             MyApp.User.Trigger('new_class');
        }
    })

},

save: function(class){
    var add_class = new Myapp.Model.Class({ 
        class_id: class,
        user_id: user.id
    });
    add_class.save()
}

1 个答案:

答案 0 :(得分:4)

我不确定我明白你在问什么, 所以我会回答两个问题:

关于This:

的上下文

为什么不将它引用到新变量?

...

render: function(){
    // here we put this in a new variable myView.
    var myView = this;

    $('li.empty').droppable({
        hoverClass: "ui-state-active",
        start: function(e){
            $(this).click('unbind');

            // here you can use myView instead of this, if you want something from your view.
            myView.model.set({'name', 'newname'});

        },
        drop: function(event, ui){
            var add_class_to_user = $(this).attr('data-id');
             MyApp.User.Trigger('new_class');
        }
    })
},

...

关于将参数传递给事件的问题

...

render: function(){
    $('li.empty').droppable({
        hoverClass: "ui-state-active",
        start: function(e){
            $(this).click('unbind');
        },
        drop: function(event, ui){
            var add_class_to_user = $(this).attr('data-id');
             MyApp.User.Trigger('new_class', add_class_to_user);
        }
    })
},

...

在您的用户模型中,您当然应该这样做:(或者更可能在另一个视图中,您可以在用户模型上绑定到该事件)

MyApp.User.bind('new_class', function(myparameter) {
    alert('yay, my parameter is:'  + myparameter);
    $('#myElement').addClass(myparameter);
});

jsfiddle中的例子:可以在这里找到.... http://jsfiddle.net/saelfaer/MWuHj/