0

Android開発のPhone Gapのデザインのすべてのページに共通のヘッダーが1つあります.1つのページでコーディングを行い、呼び出しを通じてすべてのページで使用する方法はありますか.

前もって感謝します 。

4

1 に答える 1

1

ページについての言及から、ユーザー インターフェイスのフレームワークとして jQuery Mobile を使用していますか? その場合、pagebeforecreate イベントを使用して、共通のヘッダーやフッターをすべてのページにコピーできます。このようなもの:

<html lang="en">
<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="jquery.mobile-1.2.0.min.js"></script>
    <link rel="stylesheet" href="jquery.mobile-1.2.0.css" type="text/css" />

    <script type="text/javascript" >
        $('div[data-role="page"]').live('pagebeforecreate', function(event, ui){
            $(this).prepend($('#scratch .common-header').clone());
            $(this).append($('#scratch .common-footer').clone());
        });
    </script>
</head>
<body>
    <div data-role="page" id="page-1">
        <div data-role="content" style="min-height: 200px;">
            <h1>Page 1</h1>
            <p>This is the first page.</p>
        </div>
    </div>

    <div data-role="page" id="page-2">
        <div data-role="content" style="min-height: 200px;">            
            <h1>Page 2</h1>
            <p>This is the second page.</p>
        </div>
    </div>

    <div id="scratch" style="display: none;">
        <div class="common-header" data-role="header" data-position="fixed">
            <h1>Common header</h1>
        </div>
        <div class="common-footer" data-role="footer" data-position="fixed">
            <div data-role="navbar">
                <ul>
                    <li><a href="#page-1">Page 1</a></li>
                    <li><a href="#page-2">Page 2</a></li>
                </ul>
            </div>
        </div>
    </div>
</body>

'

于 2013-06-10T17:56:55.587 に答える