Question

您好我正在将4页HTML静态网站转换为backbone.js。一个页面包含简单的HTML，但其他页面有javascript文件，如谷歌图表文件和jquery ui文件和javascript加载，绘制图表。

要在backbone.js开发，我想创建一个路由器并加载所有关于路由器值的html模板。我的index.html文件的正文部分看起来像

<body>
    <script src="js/jquery.js"></script>
    <script src="js/underscore.js"></script>
    <script src="js/backbone.js"></script>
    <script src="js/app.js"></script>

</body>

在app.js我有路由器和视图

$(function() {


//Router
var MyRouter = Backbone.Router.extend({
    //pages: '',
    routes: {
        ":route": "loadView",
        "*actions": "defaultRoute"
    },

    loadView: function(route) {
        console.log('called')
        console.log(route);
        var loadPage = new LoadPage();
        loadPage.render(route);
    },
    defaultRoute: function(actions) {

        var loadPage = new LoadPage();
        loadPage.render('index');

    }
});
//pages
var LoadPage = Backbone.View.extend({
    el: 'body',

    render: function(pages) {
        var that = this;
        //Fetching the template contents
        $.get('templates/'+pages+'.html', function(data) {
            template = _.template(data, {}); //Option to pass any dynamic values to template
            that.$el.append(template); //adding the template content to the main template.
        }, 'html');
    }
});

 var myRouter = new MyRouter();
 //start history service
Backbone.history.start();
});

如果页面没有任何javascript文件和代码，则效果很好。例如，我有一个网址http://site.local/#leaves 它加载templates/leaves.html。所有HTML都已成功加载。但在leaves.html我有google charts and jQuery ui calendar代码和文件，如

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
 <script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  //blah blah blah
</script>

并且

  <script type="text/javascript" src="bootstrap-datepicker/moment.js"></script>
   <script type="text/javascript" src="bootstrap-datepicker/daterangepicker.js"></script>
  <script type="text/javascript">
           $(document).ready(function() {

              //blah blah
 </script>

现在如果我按照我的方式加载文件，这些javascript文件和代码都没有运行。我想知道如何只在需要时加载这些javascript文件并使它们正常运行。

在Backbone.js中动态加载Javascript文件

0 个答案: