phonegap,android,backbutton:无法使它工作

时间:2012-07-16 18:56:26

标签: android jquery-mobile cordova

Phonegap 1.8.1 - 适用于2.2的Android API - jQuery 1.7.1 - jQueryMobile 1.0

我已经制作了一个非常简单的应用程序来测试它,我无法让它工作。在这里。

INDEX.HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>TestApp</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="jquery.mobile-1.1.0/jquery.mobile-1.1.0.min.css"/>
    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="jquery.mobile-1.1.0/jquery.mobile-1.1.0.min.js"></script>
    <script type="text/javascript">
        function onDeviceReady() {

            document.addEventListener("backbutton", onBackButton);
        }

        function onBackButton(e){
            console.log("C'mon guv! Gimme a chance!");
        }

        document.addEventListener("deviceready", onDeviceReady, false);

    </script>
    <script type="test/javascript" src='cordova-1.8.1.js'></script>

</head>

<body>
<div id="homepage" data-role="page" data-theme="a">
    <div data-role="header">
        <h1>Work with me here</h1>
    </div>

    <div data-role="content">
        I am page 1.
        <a href="#char-1" data-role="button">Next</a>
    </div>
</div>

<div id="char-1" data-role="page" data-theme="a">
    <div data-role="content">HAHAHA!</div>
</div>


</body>
</html>

的AndroidManifest.xml:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.example"
          android:versionCode="1"
          android:versionName="1.0">
    <uses-sdk android:minSdkVersion="2" android:targetSdkVersion="14"/>
    <supports-screens
        android:largeScreens="true"
        android:normalScreens="true"
        android:smallScreens="true"
        android:resizeable="true"
        android:anyDensity="true" />

    <application android:label="@string/app_name">
        <activity android:name="MyActivity"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>
</manifest> 

ADDENDUM - 我认为问题是'deviceready'事件要么在代码绑定到事件之前不会触发或触发。不知道如何解决它。

如果我需要提供更多信息,请告诉我..我很难过。

2 个答案:

答案 0 :(得分:1)

据我所知,后退按钮事件在onDeviceReady内无效。您必须在每个页面显示中触发事件。就我而言,它的工作原理如下,

function onDeviceReady(){
    /*Back event handler for all pages navigation*/
    $(document).bind ('pageshow', function (e, data) {
        if ($.mobile.activePage.attr('id') == 'index') {
            document.addEventListener("backbutton", function () { 
                setTimeout( function() {navigator.app.exitApp();}, 100 );
            }, true);
        }
        else{
            document.addEventListener("backbutton", function () {
                setTimeout( function() {$.mobile.changePage("#index");}, 100 );
            }, true);
        }
    });


}

在我的应用程序中,当您从第一个屏幕按下后退按钮时,它会退出应用程序,如果您按下任何页面,它会自动进入第一页。

答案 1 :(得分:1)

我很惭愧承认这一点。

<script type="test/javascript" src='cordova-1.8.1.js'></script>

这不是测试/ javascript ...它是text / javascript。

:(