觸發第二個呼叫時觸發事件

Question

有一個模塊/視圖定義：

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事件）。 如何定義正確的方法？

Answer 1

這應該是您所需要的

viewDetailed: function(e) {
        var _view = this;
        $(e.currentTarget).toggle(
            function() {
                $(this).find('i').toggleClass('icon-eye-closed icon-eye-open');
        });
    }

或者只是將功能綁定到按鈕。查看詳細信息

$('button.view-details').on('click', function() {
    var _view = this;
    $(this).find('i').toggleClass('icon-eye-closed icon-eye-open');
});