科尔多瓦应用程序显示空白页

Question

I want to develop a cordova app with multiple views using a single page with the aid of handlebars javascript library. 我想借助车把 javascript库在一个页面上开发具有多个视图的cordova应用程序。 I created a simple app with phonegap as a start under the name MyFirstApp and went to edit the index.html file under the www directory. 我创建了一个简单的应用程序，以phonegap为开头，名称为MyFirstApp，然后编辑了www目录下的index.html文件。 But nothing shows when i run the app in internet browser. 但是，当我在互联网浏览器中运行该应用程序时，没有任何显示。 Anybody sees where i am doing it wrongly? 有人看到我在哪里做错了吗？

index.html index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="msapplication-tap-highlight" content="no" />
        <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <title>Hello World</title>



    </head>
    <body>

        <div class="mainpage">
            <!--This is our template. -->
            <!--Data will be inserted in its according place, replacing the brackets.-->
            <script id="address-template" type="text/x-handlebars-template">
              <p>You can find me in {{city}}. My address is {{number}} {{street}}.</p>
            </script>

            <!--Your new content will be displayed in here-->
            <div class="content-placeholder"></div>
        </div>
        <script src="js/jquery-2.1.4.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/handlebars-v4.0.2.js"></script>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>

        <script type="text/javascript">
            app.initialize();
        </script>
    </body>
</html>

index.js index.js

    var app = {
    initialize: function() {
        this.bindEvents();
    },bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },onDeviceReady: function() {
        // Grab the template script
      var theTemplateScript = $("#address-template").html();

      // Compile the template
      var theTemplate = Handlebars.compile(theTemplateScript);

      // Define our data object
      var context={
        "city": "London",
        "street": "Baker Street",
        "number": "221B"
      };

      // Pass our data to the template
      var theCompiledHtml = theTemplate(context);

      // Add the compiled html to the page
      $('.content-placeholder').html(theCompiledHtml);
    }
};

Answer 1

Use this as your index.js: 将此用作您的index.js：

var app = {
    initialize: function() {
        this.bindEvents();
    },bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },onDeviceReady: function() {
        // Grab the template script
      var theTemplateScript = $("#address-template").html();

      // Compile the template
      var theTemplate = Handlebars.compile(theTemplateScript);

      // Define our data object
      var context={
        "city": "London",
        "street": "Baker Street",
        "number": "221B"
      };

      // Pass our data to the template
      var theCompiledHtml = theTemplate(context);

      // Add the compiled html to the page
      $('.content-placeholder').html(theCompiledHtml);
    }
};

科尔多瓦应用程序显示空白页

问题描述

1 个解决方案

解决方案1
0 2015-10-04 07:49:58

科尔多瓦应用程序显示空白页

问题描述

1 个解决方案

解决方案1 0 2015-10-04 07:49:58

解决方案1
0 2015-10-04 07:49:58