如何将Twitter Bootstrap集成到Backbone应用程序

Question

So I have the following index.html: 所以我有以下index.html：

index.html index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Project</title>
   <link href="public/css/bootstrap.css" rel="stylesheet">
  </head>
  <body>

    <script src="lib/jquery-1.11.3.js"></script>
    <script src="lib/underscore.js"></script>
    <script src="lib/backbone.js"></script>
    <script src="lib/bootstrap.js"></script>
    <script src="public/js/main.js"></script>
  </body>

main.js main.js

  (function($){
         // Object declarations goes here
        var FormLoanView = Backbone.View.extend({
          tagName: 'div',
          template: _.template('<p class="text-uppercase">Uppercased text.</p>'),
          initialize: function(){
            var data = this.$el.html(this.template())
            $('body').html(data)
          }
        })


         $(document).ready(function () {

          var LoanView = new FormLoanView({
          });

        });
       })(jQuery);

I am trying to create <p class="text-uppercase">Uppercased text.</p> and append it to the body in my index.html . 我正在尝试创建<p class="text-uppercase">Uppercased text.</p> ，并将其附加到我的index.html正文中。 It does return the p element, but the bootstrap styles don't kick in because "Uppercased text." 它的确返回p元素，但是引导样式不会出现，因为“大写文本”。 does not return with uppercase letters. 不以大写字母返回。 Anyone know why this is happening? 有人知道为什么会这样吗？ Can bootstrap classes not be using in _.template ? 引导类可以不在_.template使用吗？

Answer 1

It looks like your bootstrap.css isn't included properly. 看来您的bootstrap.css没有正确包含。 Try using the CDN or fixing the relative path of the css file. 尝试使用CDN或修复CSS文件的相对路径。

<!DOCTYPE html>
 <html>
  <head>
    <meta charset="utf-8">
    <title>Project</title>
   <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
    <script src="lib/jquery-1.11.3.js"></script>
    <script src="lib/underscore.js"></script>
    <script src="lib/backbone.js"></script>
    <script src="public/js/main.js"></script>
  </body>

Here's an example using only the CSS: https://jsfiddle.net/9nm5f0x9/ 这是仅使用CSS的示例： https : //jsfiddle.net/9nm5f0x9/

You don't need to include the bootstrap JS file as another commenter stated. 您无需像其他评论者所述的那样包含bootstrap JS文件。

如何将Twitter Bootstrap集成到Backbone应用程序

问题描述

1 个解决方案

解决方案1
0 已采纳 2015-07-11 19:35:57

如何将Twitter Bootstrap集成到Backbone应用程序

问题描述

1 个解决方案

解决方案1 0 已采纳 2015-07-11 19:35:57

解决方案1
0 已采纳 2015-07-11 19:35:57