带有$ .getScript扩展模型的Backbone.js

时间:2011-11-29 11:57:38

标签: javascript jquery backbone.js getscript

我创建了一个新的backbone.js小部件模型,我希望扩展它:

        var Widget = Backbone.Model.extend({
            constructor: function() {
              console.log('Widget constructor called.');
            }
        });

根据用户查看的页面,将通过Ajax加载许多小部件,因此对于每个小部件,我将执行以下操作:

        $.getScript('widgets/widget1', function(xhr){
            var widget1 = new pieChartWidget();
            widget1.render();
            widget1.update();
        });

“小部件/小工具1”的内容:

$(function() {

    var pieChartWidget = Widget.extend({
            render: function(json) {
              console.log('Widget render called.'); 
            },
            update: function(json) {
              console.log('Widget update called.'); 
            }
    });

});

在我的Firebug控制台中,我得到“pieChartWidget未定义”。我知道Javascript正在成功加载,我无法从中扩展“Widget”模型。

1 个答案:

答案 0 :(得分:1)

您的小部件在函数中定义。因此,在那里声明的所有变量只有在函数范围内可见。

$(function() {

  var pieChartWidget;

  // pieChartWidget is only visible here!

});

// pieChartWidget not visible here!

要从函数外部访问窗口小部件,必须将其分配给全局变量(例如,应用程序命名空间)。您也可以使用窗口(不是首选方式)。

如果您将窗口小部件分配给窗口,则代码应该保持不变:

$(function() {

  window.pieChartWidget = Widget.extend({
        render: function(json) {
          console.log('Widget render called.'); 
        },
        update: function(json) {
          console.log('Widget update called.'); 
        }
});

});