1

我正在尝试使用主干事件将事件分配给按钮:. 我试了一下所有的 tuts 是如何做到的,但到目前为止没有任何效果。我怀疑我无法添加事件,因为 $el 的内容尚未更新(我使用下划线加载模板)。所以我的问题是如何将事件分配给一开始就没有加载的类?

我的代码在回购https://github.com/PITS/bluLime-CMS的 Github 上

我正在处理的文件位于 ui/scripts/views/UserPage.js 下。

var UserView = Backbone.View.extend({
    initialize: function() {},
    render: function() {

        var data = {
        };
        var compiled = _.template(UserPage, data);

        $.when($('.main').html(compiled)).then(function() {
            this.$el = $(".userEdit");
            console.log(this.$el);
        });
    },
events: {
    "click .header button": "openPreview"
},
openPreview: function() {
    alert("HI");
}

模板位于 ui/scripts/views/templates/UserPage.js

<div class="userEdit">
 <div class="header">
    <h2>
        Edit Users
    </h2>
    <button>

    </button>
</div>
</div>

PS:我已经尝试解决问题但我失败了

4

1 回答 1

3

更改后,您的事件没有被委派给正确的元素this.$el。而不是直接设置this.$el,使用View.setElement. 它将为您处理事件重新委托。

此外,您需要创建一个view变量来保留对 的引用this,因为then回调中的上下文不再是视图。

您的渲染函数应如下所示:

render: function() {

    var data = {
    };
    var compiled = _.template(UserPage, data);
    var view = this;

    $.when($('.main').html(compiled)).then(function() {
        view.setElement($(".userEdit"));
        console.log(view.$el);
    });
}
于 2013-06-20T19:13:44.947 回答