Question

我为过滤器创建了一个简单的Backbone View，根据点击的'input'标签隐藏表元素：

var Filter = Backbone.View.extend({
tagName: "form",
events: {
    "click input[name='2013']" : "filter2013",
    "click input[name='2012']" : "filter2012"
},
filter2013: function() {
    $("tr:contains('2013-')").toggle();
},
filter2012: function() {
    $("tr:contains('2012-')").toggle();
},
render: function() {
    this.$el.html(JST['acquisitions/filter']);
    $("#filter-container").append(this.$el);
    return this;
}
});

根本不优雅，特别是如果我想添加更多'input'元素，这将导致View中重复代码的更多自定义函数。也许for循环结合jquery在网页中查找数字（比如2013年，2012年，2011年等）并基于此生成事件。或者我可能需要完全从视图中删除事件。

有什么建议吗？

Answer 1

我会向class添加<input>，比如说class="year"，以便更容易找到，然后绑定到input.year上的点击事件并获取年份超出事件的currentTarget.name。像这样：

var Filter = Backbone.View.extend({
    // ...
    events: {
        "click input.year" : "filter_year"
    },
    filter_year: function(ev) {
        $("tr:contains('" + ev.currentTarget.name + "-')").toggle();
    },
    //...
});

重构Backbone查看代码以消除重复

1 个答案: