PhoneGap Android jQuery Mobile应用程序在没有CSS / JS的设备上运行

时间:2012-08-29 14:45:38

标签: android cordova jquery-mobile

我有一个专为Android设计的Phonegap(Cordova 2.0.0)应用程序,使用jQuery Mobile + Backbone.js运行。当我在模拟器上测试它时,它可以正常工作(在浏览器中运行,出现CSS和JS等)。

当我签名并将其安装在非调试设备上时,它会运行但没有CSS和JS(因此基本上显示了一个没有运行JS的无样式HTML文档)。

我的应用程序正文如下:

<!DOCTYPE html>
<html>
  <head>
  <title>My App</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta charset="utf-8">

     <link rel="stylesheet" href="libraries/jquery.mobile-1.1.1.min.css" />
     <link rel="stylesheet" href="assets/css/style.css" />

     <script src="http://localhost:8080/target/target-script-min.js#anonymous"></script>

    <script type="text/javascript" charset="utf-8" src="libraries/cordova-2.0.0-ios.js"></script>
    <script src="libraries/jquery-1.7.2.min.js"></script>
        <script src="libraries/underscore.js"></script>
        <script src="libraries/backbone-min.js"></script>
        <script src="libraries/backbone.localStorage-min.js"></script>
        <script src="libraries/detect.js"></script>
        <script type="text/javascript" src="libraries/sha1.js"></script>
    <script type="text/javascript" src="app.js"></script>           

    <script type="text/javascript">

          var jqmReady = $.Deferred();
        var deviceReady = $.Deferred();

        /**
         * on load - manages dependency between jquery mobile and phonegap
         */
        function onBodyLoad()
        {
          // get device
          $.os = {};
        $.os.android = navigator.platform.indexOf("android")>=0;
        $.os.ios = navigator.platform.indexOf("iPhone")>=0 || navigator.platform.indexOf("iPad")>=0;

        // listen to device ready
        if ($.os.android || $.os.ios) {
            document.addEventListener("deviceready", deviceReady.resolve, false);
        }
        else {
          // must be in a browser, so immediately resolve
          deviceReady.resolve();
        }
        }

        $(document).bind("mobileinit", jqmReady.resolve);
        $(document).bind("mobileinit", function() { console.log('mobileinit'); });
        $(document).bind('pageinit', function() { console.log('pageinit'); });

        // when jquery mobile and device ready, then fire
        $.when(jqmReady, deviceReady).then(function() {
          console.log('Ready');
        // disable push state: http://jquerymobile.com/demos/1.1.1/docs/pages/page-links.html
        $.mobile.pushStateEnabled = false;
        App.init();
      });

      onBodyLoad();

    </script>           
  </head>
  <body onload="" data-lat="" data-lng="">

有没有人遇到过这个?我想知道它是否与相对路径(而不是绝对路径)有关,或者我是如何在Eclipse中将它打包在一起的。此外,在iPhone上它工作正常。

感谢。

0 个答案:

没有答案