0

在我的 Android 开发 Phone Gap 设计中,我的所有页面都有一个通用标题。有没有办法在一页中对其进行编码并通过调用在所有页面中使用它。

提前致谢 。

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 回答