0

iOS用の非常にシンプルな電話ギャップアプリケーションを作成しようとしています。クエリモバイルを使用しています。問題は、ボタンのクリックでjavascriptイベントを発生させることができないことです。
私が今持っているコード： 

<!DOCTYPE html>
<html>
<head>
    <title>Title</title>
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="js/jquery.mobile-1.2.0.css" />
    <script type="text/javascript" charset="utf-8" src="cordova-1.8.1.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery.mobile-1.2.0.min.js"></script>
    <script type="text/javascript">
        document.addEventListener("deviceready", onDeviceReady, false);

        function onDeviceReady() {
        }

        function showAlert() {
            navigator.notification.alert("Cordova is working");
        }

    </script>
</head>
<body>
    <div data-role="page" id="options" data-add-back-btn="true" data-back-btn-text="Atgal">
        <div data-role="header" data-position="fixed">
            <h1>Title</h1>
        </div>
        <div data-role="content">
            <h1>Alert</h1>
            <p><a href="#" onclick="showAlert(); return false;" data-role="button">Show alert</a></p>
        </div>
    </div>
</body>
</html>

問題を解決するために複数の解決策を試しましたが、どれも機能しません。hrefに＃が付いたボタンがある場合、クリックしても色は変更されません。URLを追加すると色が変わります。ただし、javascript関数を呼び出すことはありません。もう1つの問題は、document.addEventListener("deviceready", onDeviceReady, false);インデックスページでのみ機能することです。別のページにリダイレクトする最初のページのボタンを押すと、OnDeviceReady関数が呼び出されることはありません。
誰かアイデアはありますか？

4

5 に答える 5

2

onDeviceReady()一度だけ呼び出されます（デバイス（つまりCordova）の準備ができたとき）。$(document).on('pageinit', '#pageid', function() { });ページに移動するたびに何かを起動する必要があります。

于 2012-10-08T19:25:41.977 に答える
2

bodyタグにタグを追加する必要があり、javascriptのonBodyLoad（）関数は次のようになります。

   function onBodyLoad()
    {       
      document.addEventListener("deviceready", onDeviceReady, false);
    }
于 2012-10-22T10:28:03.460 に答える
1

私は電話のギャップとクエリモバイルの完全な初心者なので、愚かな間違いを犯しました。問題は、ボタンをクリックするとページ全体ではなく、本体部分のみが読み込まれることです。これは、最初のページにあるjavascriptのみを使用することを意味します。そしてそれが私の問題でした。今、私はすべてのjavascriptを別々のファイル（両方のファイルのすべてのjavascript）に入れました、そしてそれは動作します。

于 2012-10-10T16:50:22.237 に答える
0

jQueryで次のことを試してください。

<!DOCTYPE html>
<html>
<head>
    <title>Title</title>
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="js/jquery.mobile-1.2.0.css" />
    <script type="text/javascript" charset="utf-8" src="cordova-1.8.1.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery.mobile-1.2.0.min.js"></script>
    <script type="text/javascript">
        document.addEventListener("deviceready", onDeviceReady, false);

        function onDeviceReady() {
        }

        function showAlert() {
            navigator.notification.alert("Cordova is working");
        }

        $(function() {
            $("#my_link").click(function() {
                showAlert();
            });
        });

    </script>
</head>
<body>
    <div data-role="page" id="options" data-add-back-btn="true" data-back-btn-text="Atgal">
        <div data-role="header" data-position="fixed">
            <h1>Title</h1>
        </div>
        <div data-role="content">
            <h1>Alert</h1>
            <p><a id="my_link" href="#" data-role="button">Show alert</a></p>
        </div>
    </div>
</body>
</html>

お役に立てれば。結果を教えてください。

于 2012-10-09T03:36:02.777 に答える
0

mdボタンのz-indexを高く設定しても、iOSではクリックされません。Androidでは問題なくクリックされました。私の場合、親コンテナ<md-subheader>をz-indexに設定する必要がありました：-1; それからそれは働いた。

于 2015-07-30T16:06:45.457 に答える