带有PhoneJS和PhoneGap的简单Android应用程序冻结了_Android_Cordova_Phonejs

带有PhoneJS和PhoneGap的简单Android应用程序冻结了

android cordova

带有PhoneJS和PhoneGap的简单Android应用程序冻结了,android,cordova,phonejs,Android,Cordova,Phonejs,我正在使用phonegap和phonejs编写一个小型android应用程序。代码如下问题是应用程序 1）即使加载的数据量相当小，也需要2-3秒来加载 2）它不会对点击做出反应，我想显示的覆盖图永远不会出现 3）一般情况下，事件似乎未被处理。即使创建的div数超过屏幕空间，我也无法通过滑动滚动屏幕 4）甚至安卓的后退按钮也不起作用我在emulator和设备上都进行了测试，虽然我最初认为emulator工作得不好，但后来我在设备上看到它没有任何改进。我所做的对我来说似乎相当简单。创建

我正在使用phonegap和phonejs编写一个小型android应用程序。代码如下

问题是应用程序 1）即使加载的数据量相当小，也需要2-3秒来加载 2）它不会对点击做出反应，我想显示的覆盖图永远不会出现 3）一般情况下，事件似乎未被处理。即使创建的div数超过屏幕空间，我也无法通过滑动滚动屏幕 4）甚至安卓的后退按钮也不起作用

我在emulator和设备上都进行了测试，虽然我最初认为emulator工作得不好，但后来我在设备上看到它没有任何改进。我所做的对我来说似乎相当简单。创建一个数组，生成垂直列出的div列表，并在该数组中的div上单击事件。我做错了什么

<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport"
    content="user-scalable=no, width=320, initial-scale=1" />
<!-- <link rel="stylesheet" type="text/css" href="css/index.css" />-->
<title>My First Application</title>
<link rel="stylesheet" type="text/css" href="css/dx.common.css" />
<link rel="stylesheet" type="text/css"
    href="css/dx.android.holo-dark.css" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="js/knockout-3.0.0.js"></script>
<script type="text/javascript" src="js/globalize.min.js"></script>
<script type="text/javascript" src="js/dx.phonejs.debug.js"></script>
<!--  <link rel="stylesheet" type="text/css" href="layouts/SlideOut/SlideOutLayout.css" />
        <link rel="dx-template" type="text/html" href="layouts/SlideOut/SlideOutLayout.html" />
        <script type="text/javascript" src="layouts/SlideOut/SlideOutLayout.js"></script> -->
<script type="text/javascript" src="js/transports.js"></script>
<script type="text/javascript">
    window.AppNamespace = {};
    $(function() {
        DevExpress.framework.html.layoutControllers.push({
            navigationType : "myNavigation",
            controller : new DevExpress.framework.html.DefaultLayoutController(
                    {
                        layoutTemplateName : "myLayout"
                    })
        });
        AppNamespace.app = new DevExpress.framework.html.HtmlApplication({
            namespace : AppNamespace,
            navigationType : "myNavigation"
        });
        AppNamespace.app.router.register(":view", {
            view : "home"
        });
        AppNamespace.app.navigate();
    });

    transports.sort(function(a, b) {
        return a.date > b.date;
    });
    // modify transport, add class
    for ( var jj = 0; jj < transports.length; jj++) {
        transports[jj].textbinding = transports[jj].date + " "
                + transports[jj].bookingnr;
        if (transports[jj].from == "Berlin") {
            transports[jj].css = "flight-item-b " + transports[jj].bookingnr;
        } else
            transports[jj].css = "flight-item-f " + transports[jj].bookingnr;
    }

    AppNamespace.home = function() {
        var viewModel = {
            detailsVisible : ko.observable(false),
            buttonVisible : ko.observable(false),
            popupTitle : 'Kaiis Pupspup',
            _transports : ko.observable(transports),
            selItem : ko.observable(transports[0]),
        }
        var me = viewModel;
        viewModel.onclick = function(selected) {
            //me.selItem(selected);
            me.detailsVisible(true);
            //alert (selected.arrival);
        };
        viewModel.hideDetails = function() {
            me.detailsVisible(false);
        }
        return viewModel;
    };
</script>
</head>
<body>
    <div data-options="dxLayout : { name: 'myLayout' } ">
        <div
            data-options="dxToolbar: { items: [ { text: 'TransPonder', align: 'center' } ] }"></div>
        <div
            data-options="dxContentPlaceholder  : { name: 'content', transition: 'slide' } "></div>
    </div>
    <div data-options="dxView: {name: 'home'}">
        <div data-options="dxContent : { targetPlaceholder: 'content' } ">
            <div data-bind="foreach: _transports()">
                <div data-bind="css: $data.css, click: $parent.onclick">
                    <div data-bind="text: $data.textbinding"></div>
                </div>
            </div>
        </div>
        <div data-bind="dxOverlay:{visible: detailsVisible }">
            <p>The text that should be shown in the overlaying window.</p>
            <div data-bind="dxButton: { text: 'Close', clickAction: hideDetails }"></div>
        </div>
    </div>
</body>
</html>

我想你忘了在index.html文件中包含phonegap.js。。。包括phonegap.js文件，并在deviceReady事件后尝试执行代码。我包括了js/dx.phonejs.debug.js，这不一样吗？我想不，应该包括phonegap.js或cordova.js文件。您使用的是哪个phonegap版本。。？

var transports = [
{
   bookingnr: "4HPXTJ",
   from: "Berlin",
   to: "Frankfurt",
   date: "2013-01-23",
   departure: "17:45",
   arrival: "19:00",
   carrier: "Lufthansa"
},
{
   bookingnr: "4HPXTJ",
   from: "Frankfurt",
   to: "Berlin",
   date: "2013-11-24",
   departure: "14:15",
   arrival: "15:30",
   carrier: "Lufthansa"
},
    ...
];