1

Backbone を使用してビューを作成するのはこれが初めてですが、ドキュメント内の既存の要素への変更をレンダリングできません。

var ParamsView = Backbone.View.extend({

    el: $('#node-parameters'),

    initialize: function() {
        console.log('WOW');
    },

    render: function() {
        console.log('doing it');
        console.log(this.$el.length);
        console.log($('#node-parameters').length);
        this.$el.append('<span>hello world!</span>');
        return this;
    }

});

    var v = new ParamsView();
    v->render();

単語hello world!はターゲットに表示されませんdiv。

ビューがレンダリングされると、コンソールは次のように出力します。

WOW
doing it
0
1

したがって、jQueryセレクター$('#node-parameters')が1つのDOM要素を見つけていることはわかっていますが、ビューはそれを使用していません。

私が間違っていることはありますか？

編集:this.el JS デバッガーでは、ビューに対して未定義であることがわかります。

4

1 に答える 1

2

あなたのコードはおそらくこれと同等です：

var ParamsView = Backbone.View.extend({
    el: $('#node-parameters'),

    initialize: function() {
        console.log('WOW');
    },

    render: function() {
        console.log('doing it');
        console.log(this.$el.length);
        console.log($('#node-parameters').length);
        this.$el.append('<span>hello world!</span>');
        return this;
    }
});

$(document).ready(function() {
    var v = new ParamsView();
    v.render();
});

http://jsfiddle.net/nikoshr/mNprr/

あなたのクラスはDOM ready イベントの前に宣言されていることに注意してください。

で拡張時にelを設定し$('#node-parameters')ます。$はすぐに実行される関数ですが、そのため未定義の要素が取得され、その時点で #node-parameters は存在しません。

で要素を注入することによりnew ParamsView({el: '#node-parameters'})、DOM Ready イベントの後に有効な el を設定します。経由で設定することもできます

var ParamsView = Backbone.View.extend({
    el: '#node-parameters'
});

elDOM Ready イベントの後、クラスをインスタンス化するときに評価されます。http://jsfiddle.net/nikoshr/mNprr/1/

于 2013-04-12T16:50:08.643 に答える