1

OverlayViewとStoryViewの2つのビューがあります。StoryViewをOverlayViewに追加する必要があります（どちらも動的に作成されます）。OverlayViewで動的に#overlaydivを作成しますが、StoryViewの「el」を#overlayに設定すると、StoryViewのthis。$elは空の配列になります。#overlay divは、StoryViewが作成されるまでにDOMに確実に存在します。

StoryViewに動的に作成された#overlayを「el」として認識させるにはどうすればよいですか？'el'がビューが追加される'親'コンテナであると仮定するのは正しいですか？OverlayViewの「el」は実際には「#overlay」である必要がありますか？

OverlayView：

OverlayView = Backbone.View.extend({
    el: $('body'),

    events: {
        'click #film': 'hideOverlay'
    },

    initialize: function() {
        this.render();
    },

    render: function() {
        this.$el.append('<div id="overlay"></div>');
        return this;
    }
});

StoryView：

var StoryView = Backbone.View.extend({
    el: $('#overlay'),

    events: {
        'click .close': 'closeStory'
    },

    initialize: function() {
        this.render();
    },

    render: function() {
        console.log(this.$el); // Returns empty array []
        return this;
    }
});
4

1 に答える 1

6

あなたの問題はStoryView el、jQuery オブジェクトではなく、単にセレクターであるべきだということです。これにより、Backbone は、指定した時点で (まだ存在していない) オブジェクトを取得しようとしますel。に変更el: $('#overlay')するだけel: '#overlay'です。$('body')必要ではないため、最初のビューでも同じことを行う場合があります。jQuery オブジェクトの代わりに常にセレクターを使用すれば問題ありません。

ここでの作業例。

于 2012-04-13T15:01:34.437 に答える