2011-03-11 27 views
17

Bağlama kullanıyorum backbone.js her modelin görünümü için bölümlenmiş bir kontrol tipi UI öğesi var. Her biri birkaç li elemente sahip bir uldan oluşur. Bu öğelerden biri tıklandığında, hangisinin tıklandığını belirleyebilir ve modeli uygun değerle güncelleyebilecek bir olayı bağlamak istiyorum.backbone.js Olay

sorun Omurga "Bu" geri arama işlevi görünümü değil, li elemanları ifade ettiği olayları (bu bakış etkinlik karma olarak ifade edilmiştir), örneğin bağlanması anlamına gelir. Bu, birkaç li öğenin hangisinin tıklandığına karar veremediğim anlamına gelir. Ben bağlayıcı normal jQuery kullandıysanız, "Bu" li elementlere bağlı olabilir, ama sonra ben artık modelin izini yok, bu yüzden güncelleme olamaz.

cevap

44

anda bence oldukça kötü kalıbıdır uygun olması ne olursa olsun hiç this ayar jQuery'nin alışkanlığı - neyse, bunu güvenmek zorunda asla:

onClick: function(e) { 
    this;    // Still the view instance (as it should be). 
    e.target;   // The element that was clicked. 
    e.currentTarget;  // The element that was bound by the click event. 
} 

... You uygun şekilde target veya olay nesnesinin currentTarget, kullanabilir. @jashkenas yukarıdaki cevap üzerine yorum yapamam neden

+0

O ve Internet Explorer kapsam temiz değilse this' window' 'olarak' yorumlama gibi kötü bir huyu vardır. – rxgx

+0

Bu yalnızca jquery tetiklenen olaylar için çalışır, değil mi? Omurganın trigger() işleviyle tetiklenen olaylar bir jquery olayını geçmez, bunun yerine trigger() –

+2

@JensAlm'ye girdiğiniz argümanlar doğrudur. Backbone'un .trigger() işlevi Backbone modellerinde olayları tetiklerken, Backbone görünümleri 'event' listesi jQuery's delegateEvents öğesine bağlanır. Onlar iki farklı olay sistemidir. –

20

anlamaya olamaz. Onun yöntemi doğru (teşekkürler!) Ama durumu açıklığa kavuşturacağını düşündüm: olay işleyicinizde, olayın bağlı olduğu öğeyi kurtarabilirsiniz. Örnek omurga kod şu şekilde görünecektir::

MyView = Backbone.View.extend({ 
    events: { 
     'click .item': 'handleClick' 
    }, 

    handleClick: function(e) { 
     this; // The view instance 
     e.target; // The element that was clicked 
     e.currentTarget; // The element that was bound by the click event 
    } 
}); 

evet Henüz HTML5 içine değilim :)

Düzenleme ... benim form alanlarının tümünde kurulum varsayılan metin için kullanabilir Btw, e.target ham öğedir. JQuery erişimini elde etmek için $ (e.target) kullanmanız gerekecek.

+0

Omurga kullanıyorsanız, bu yoldur. – UpTheCreek

+0

Yine de, tıklandığında nelerin CSS sınıfını bilmesi gerektiğini bilmeniz gereken bir sorun var. 'Bu tıklayın. $ El' gibi bir şey: 'handleClick' tercih edilebilir. – bergie3000

+1

Nesnenin görünümünde bulunan öğelere farklı davranışlar atanmış olabileceğinden (örneğin, düzenleme için bir bağlantı, silme için bir başka öğe, öğenizin başlığının sağına yerleştirilmiş) bu tıklanma, bu başlık sizi tıkladığında görünüm görünümüne yönlendirir.). Yoksa yanlış mı düşünüyorsun? – Ben