当移动到下一页时页脚隐藏

Question

我有这样的html结构

<div data-role="page" data-theme="b">

    <div data-role="header" data-theme="b">
        <h1>header</h1>
    </div><!-- /header -->

    <div data-role="content" data-theme="b">
        <a href="#p2" data-role="button" data-icon="arrow-r" data-theme="b" data-iconpos="right">next pagey</a>  
    </div><!-- /content -->

    <div data-role="footer" data-theme="b" data-position="fixed">
        <h1>Footer</h1>
    </div><!-- /footer -->

</div><!-- /page -->

<div id="p2" data-role="page" data-theme="b">

    <div data-role="header" data-theme="b">
        <h1>header</h1>
    </div><!-- /header -->

    <div data-role="content" data-theme="b">
        <h1>Content</h1> 
    </div><!-- /content -->

    <div data-role="footer" data-theme="b" data-position="fixed">
        <h1>Content</h1>
    </div><!-- /footer -->

</div><!-- /page -->

但是当我单击下一页时，下一页会在标题中自动添加后退btn，当我单击后退按钮时，上一页会出现，但页脚会消失..

在FF中工作正常，但在ipad中不行模拟器

Answer 1

让固定页脚发挥作用对于 JQM 团队来说是一件痛苦的事情。我认为这只是另一个由不可预见的情况引起的小错误。好吧，没关系......

一点见解：
那些该死的移动浏览器不支持固定CSS定位，所以这是通过javascript和绝对位置完成的（以及大量的黑客 - 我敢打赌）

这应该已经给你一个线索......

如果该行为不仅仅针对模拟器（很有可能！），并且在您用内容填充页面后问题仍然存在（我的意思是 - 完成编写应用程序），那么您需要做的就是启动重新定位页脚的代码。我会这样做：

$('div').live('pageshow',function(){ $(window).trigger('orientationchange') });

orientationchange 事件应该起作用。如果方向更改导致任何新问题，您还可以尝试调整大小。