私はこのようなテンプレートを持っています:
<a class="btn btn-info btn-small edit" model-id="<%= model.id %>" href="">
<i class="icon-pencil icon-white"></i>
edit
</a>
そして、このように定義されたビュー:
src.views.WinesView = Backbone.View.extend({
[...]
events: {
'click a.edit': 'edit'
},
edit: function(e) {
e.preventDefault();
var a = $(e.target);
var id = a.attr('model-id');
app.edit(id);
},
[...]
ユーザーが「編集」テキストをクリックすると、すべてが正常に機能しますが、ユーザーがアイコン-鉛筆アイコン(タグのコンテンツ)をクリックすると、イベントは正しく発生しますが、e.targetはiタグを指し、にではありません。
実際、私が欲しいのは、バインドしたタグ内のタグがイベントを発生させた場合、そのイベントを発生させ、バックボーンからバインドした要素への参照を簡単に取得したいということです...
私はそれを解決することができます:
edit: function(e) {
e.preventDefault();
var a = $(e.target);
if (a[0].tagName!=='A') { a = a.parent(); }
var id = a.attr('model-id');
app.edit(id);
},
しかし、私はそれを達成するためのより良い、よりエレガントで一般的な方法があるかどうか疑問に思っていました...