2

jQueryMobile と PhoneGap を使用して、クロス プラットフォームのモバイル アプリを開発しています。アプリに読み込まれた最初のページ (「ホーム」ページ) にバインドしていますが、pageinit イベントが発生しません。これが私のカスタムJavaScriptです：

$('#home').live('pageinit', function()
{
    alert('firing pageinit');
}

ページ定義を含む私の index.html ファイルは次のとおりです。

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
    <link rel="stylesheet" href="css/jquery.mobile-1.2.0.min.css" />
    <link rel="stylesheet" href="css/custom.css" />
</head>
<body>
    <div data-role="page" id="home">
        <div data-role="header" data-position="fixed">
            <a href="#refresh" data-icon="refresh" data-transition="slide" id="refresh">Refresh</a>
            <h1>MyListingsApp</h1>
            <a href="#add_listing" data-icon="plus" data-transition="slide" id="add_listing_button">Add</a>
        </div>

        <div data-role="content">
            <ul data-role="listview" id="listings" data-filter="true" data-filter-placeholder="Filter listings...">
                <li id="hit_to_begin"></li>
            </ul>
        </div>

    </div>

<script type="text/javascript" src="cordova-2.2.0.js"></script>
    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/jquery.mobile-1.2.0.min.js"></script>

    <script src="js/jquery.ui.map.full.min.js"></script>
    <script src="js/jquery.ui.map.services.min.js"></script>
    <script src="js/jquery.i18n.min.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript">
        app.initialize();
    </script>
    <script type="text/javascript" src="js/custom.js"></script>

</body>

イベントが発生せず、ロードされたホームページだけが表示されます。jQueryMobile docs によると、これはページの初期化時にカスタマイズを処理するための適切なバインディングです。

4

1 に答える 1

2

この例を見てください：http：//jsfiddle.net/Gajotres/BGkaq/、私はあなたに2つの例を作りました、あなたはそれらをページの下部に見つけることができます。

イベントバインディングの例1：

// in (url^=home) home is a page id
$(':jqmData(url^=home)').live('pagebeforecreate',function (event) {
    alert('Event has been triggered!');            
});

イベントバインディングの例2：

$('#home').live('pagebeforecreate',function (event) {
    alert('Event has been triggered!');            
});
于 2012-11-29T09:16:12.390 に答える