0

バックボーンビューがあります。コンテンツ（AJAXを使用したバックボーン上のコンポーネント）をロードします：

        render: function () {
            var self = this;
            $.get('/Blog', request, function (data) {
                self.$el.html(data);
                model.trigger('blogContainerLoaded');
            });
        }

コンポーネントコード：

 window.App = {


init: function (options) {
    var BlogModel = Backbone.Model.extend({
    });

    var model = new BlogModel();

    var BlogController = Backbone.Router.extend({
        routes: {
            "": "posts",
            "posts": "posts",
            "posts/:postId": "post",
            "posts/:postId/": "post",
        },
        posts: function (anchor) {
            window.App.views.posts.render(anchor);
        },
        post: function (postId, commentId) {
            window.App.views.post.render(postId, commentId);
        },
    });

    var controller = new BlogController();
    if (notLoaded) {
        var views = {
            posts: new PostListView({ model: model, controller: controller }),
            post: new PostView({ model: model, controller: controller }),
        };
        this.views = views;
        Backbone.history.start();
    }
}

};

var PostListView = Backbone.View.extend({
el: $(".posts"),
events: {
    "click .js-edit-message": "editMessage",
    "click .js-open-post": "navigateToPost",
    "click .js-move-post": "move"
},
editMessage: function () {
    debugger;
},
navigateToPost: function () {
    debugger;
},
move: function () {
    debugger;
},

すべてのhtmlコードはajaxでロードされます。動作しますが、イベント（クリックなど）が発生しません！AJAXなしでブログコンポーネントをロードすると、イベントが機能します。助けてください！

4

1 に答える 1

1

ほとんどの場合、ajax呼び出しが完了する前にビューがインスタンス化されます。ajaxは非同期であるため、（最終的には）ビューを初期化するためのコードが最初に実行されます。したがって、ビューがイベントをDOMにアタッチしようとしている場合、必要な要素が存在しません。

これは、ajax部分を削除すると、コードが機能する理由も説明します（これで同期され、ビューコードを初期化する前にDOMが存在します）。

次のように、初期化コードをajaxコールバック内に配置してみてください:(可能であれば）

    render: function () {
        var self = this;
        $.get('/Blog', request, function (data) {
            self.$el.html(data);

            self.blogContainer = new BlogContainerView();  // Or however you do it
        });
    }

もう1つの可能性はtrigger.('blogContentLoaded')、その時点でイベントを添付しておくことです。あなたの場合、 Backbone.ViewのdelegateEvents()メソッドが役立つかもしれません。

またはその性質の何か。これで、ViewオブジェクトがイベントをアタッチするためにDOMが使用可能であることが保証されます。

于 2012-08-23T17:25:23.540 に答える