JavaScriptイベントに属性を追加するにはどうすればよいですか？行レベルで

Question

私はイベントをキャッチし、追加のパラメータをメインビューで

onRowClick: function(e){ 
    console.log("Event in row"); 
    e.model = "test"; 
    console.log(e.model) // prints 'test' 
} 

を追加しようと、私は再び同じイベントをキャッチ

onRowClick: function(e){ 
    console.log("Event in main view"); 
    console.log(e.model) //prints undefined 
} 

コンソール：

>Event in row 
>test 
>Event in main view 
>undefined 

どのようにすることができますイベントにアトリビュートを追加しますか？

Answer 1

。最初のものを変更しても後者は変更されません。

これらのイベント間でデータをやり取りする場合は、そのデータを別の場所に保存する必要があります（たとえば、クロージャー、またはウィンドウオブジェクトにスコープを保存することを気にしない場合）。

Answer 2

データをjQueryイベントに渡す方法は2つあります。 1つはe.dataで、このようにe.dataに任意のプロパティを追加できます。

http://www.barneyb.com/barneyblog/2009/04/10/jquery-bind-data/

他の方法は、次のようなクロージャを使用することです：答えはあなたが同じイベントではなく、2つ（最初は）同じイベントをキャッチしていないということです

function myFunc() { 
    var model = 'test';  

    var x = { 
     onRowClick: function(e){ 
      console.log("Event in row"); 
      console.log(model) // prints 'test' 
     } 
    } 
} 

Answer 3

メインビューでrowClickイベントを捕捉するのではなく、行ビューで捕捉してバックボーンイベントシステムに渡すことをお勧めします。 親ビューはクリックを捕捉するためにその行にバインドできます。

そこにこれを行うには、2つの方法、

トリガあなたの行のモデルのカスタムイベントがあり、それはハックとパフォーマンスヒットのように思えるものの、コレクション内のすべてのモデルに、親バインドをしましょう。

私はイベントアグリゲータでそれをやってお勧め：

var App = { 
    events: _.extend({}, Backbone.Events); 
}; 

var myGeneralView = Backbone.Views.extend({ 

    initialize: function() { 
    _.bindAll(this, "catchMyCustomEvent"; 

    /* 
     and here you bind to that event on the event aggregator and 
     tell it to execute your custom made function when it is triggered. 

     You can name it any way you want, you can namespace 
     custom events with a prefix and a ':'. 
    */ 
    App.events.bind('rowView:rowClicked'); 
    }, 

    catchMyCustomEvent: function (model, e) { 
    alert("this is the model that was clicked: " + model.get("myproperty")); 
    } 

    // other methods you will probably have here... 
}); 

var myRowView = Backbone.Views.extend({ 

    tagName: "li", 

    className: "document-row", 

    events: { 
    "click" : "myRowClicked" 
    }, 

    initialize: function() { 
    _.bindAll(this, "myRowClicked"); 
    }, 

    myRowClicked: function (e) { 

    /* 
     You pass your model and your event to the event aggregator 
    */ 
    App.events.trigger('rowView:rowClicked', this.model, e); 
    } 

});