モジュール/ビューの定義があります:
define(['jquery', 'underscore', 'backbone', 'text!templates/product.html'],
function($, _, Backbone, productTemplate) {
var ProductView = Backbone.View.extend({
tagName: "li",
className: "span3",
events: {
"click button.view-details": "viewDetailed"
},
viewDetailed: function(e) {
var _view = this;
$(e.currentTarget).toggle(
function() {
$(this).find('i').removeClass('icon-eye-open');
$(this).find('i').addClass('icon-eye-close');
},
function() {
$(this).find('i').removeClass('icon-eye-close');
$(this).find('i').addClass('icon-eye-open');
}
);
},
initialize: function() {
this.model.bind('change', this.render, this);
this.model.bind('destroy', this.close, this);
},
render: function() {
var compiledTemplate = _.template(productTemplate, this.model.toJSON());
this.$el.append(compiledTemplate);
return this;
}
});
return ProductView;
});
初めて押しbutton.view-details
ても効果はありません(私が理解している限り、単にtoggle
イベントを登録するだけです)。どうすればそれを正しい方法で定義できますか?