Question

我有这个Backbone App，我获取一个JSON文件，显示字母表，当点击其中一个字母时，它将显示以该字母开头的相关艺术家。它到目前为止工作，但我想要实现的是在点击的字母上添加某种active - 类。我怎样才能做到这一点？

我的观点如下：

function (App, Backbone) {

    var Alphabet = App.module();
    var LetterView = Backbone.View.extend({
        template: 'alphabetlist',
        tagName: 'li',  
        serialize: function() {
            return this.model.toJSON();
        },  

    });

    Alphabet.View = Backbone.View.extend({
        tagName: 'ol',
        className: 'alist',
        initialize: function() {
            this.listenTo(this.collection, 'all', this.render);
            this.listenTo(this.collection, 'sync', this.onSync);

            this.collection.fetch();
        }, 
        beforeRender: function() {
            var self = this;

            this.collection.each(function(item) {
                self.insertView(new LetterView({model: item}))
            })
        },
    });
    Alphabet.AlphabetCollection = Backbone.Collection.extend({
        url: 'js/json/AlphabetCollection.json'
    });

    return Alphabet;
}

那么有人可以帮助我吗？提前谢谢......

修改

当我这样做时：

    events: {
        'click a' : 'toggle'
    },

    serialize: function() {
        return this.model.toJSON();
    },

    toggle: function(event) {
        this.$el.parent().addClass('test');
    },

<ol> - 元素获取类，但仍未定位<li> - 元素...

Answer 1

应该是这样的。

var LetterView = Backbone.View.extend({
    template: 'alphabetlist',
    tagName: 'li',
    events : {
        "click li" : "toggle"
    },  
    serialize: function() {
        return this.model.toJSON();
    },  

    toggle : function(e){
        var active = $(e.currentTarget);
        active.addClass('active');
        $('li').not(active).removeClass('active');
    }

});

BackboneJS添加和删除要点击的元素的类

1 个答案: