進行中のすべてのファイルアップロード、FileUploadProgressModel、BackboneコレクションのUploadProgressCollectionを保存しています。私はthis.$el
、UploadPrograssView以外のすべての機能を持っています。私は$el
を<body>
タグに初期化しました。バックボーンビューが間違っていますel
this.$el
をHTMLページの本体要素にしたい代わりに、新しい<body>
HTMLElementがあります。 this.$el
は、私が望む<body>
タグではないため、this.$el
を使用してアップロードプログレスバーの要素にアクセスできません。このエラーの原因は何ですか?あなたが明示的にをする必要が
var FileUploadProgressModel = Backbone.Model.extend({
initialize : function(){
this.on("change:loaded_size", function(){
this.set("progress", 100 * this.get("loaded_size")/this.get("total_size"));
});
},
defaults : {
progress : 0,
total_size: 1,
loaded_size : 0,
}
});
var UploadProgressCollection = Backbone.Collection.extend({
model: FileUploadProgressModel,
initialize : function(){
this.on("update", function(){
// View already registered to this event
});
},
});
var UploadPrograssView = Backbone.View.extend({
tagName : "body",
initialize : function(){
_.bindAll(this, "render");
this.model.bind('change', this.render);
this.render();
},
render : function(){
var total_loaded_size = 0;
var total_file_upload_size = 0;
tracker.forEach(function(model){
if(!isNaN(model.get("loaded_size"))) total_loaded_size += model.get("loaded_size");
if(!isNaN(model.get("total_size"))) total_file_upload_size += model.get("total_size");
});
var progress = parseInt(total_loaded_size/total_file_upload_size * 100, 10) + '%';
//TODO bad way of doing things. I want to user this.$el but it has lost the actual referance to the body instread it has this new HTML element "<body><body>"
$('.progress .progress-bar').css(
'width',
progress
);
return this;
}
});
var tracker = new UploadProgressCollection();
var trackerView = new UploadPrograssView({model : tracker });
ビューとして ''
タグ自体を作るために良いアイデアではありません。ビューをクリアすると、スクリプトタグやプラグインなどで注入されたものなどのすべてがクリアされます。コンテナを ''の中に追加して操作してください。 –