使用不同面板的Jquery Mobile导航会中断CSS

问题描述

| 我有一个问题，我不能明确地认为是导航问题或内容的动态显示问题。首先，我使用的是一个html页面，该页面托管多个页面，其中每个页面都有两个导航栏：页眉和页脚。 第一页显示的内容是使用getJSON（）从后端的php作为JSON对象从php动态获取的。使用这些可折叠项目的html（）函数，将内容显示为三个可折叠项目的子项。内容填充在H1中，并且分别列出了可折叠项的两个子项标签。 我的上方导航栏具有三个条目（第1页，第2页，第3页）。当我从第1页导航到第2页，然后从第2页单击第1页条目时，一切都会按预期进行，即，我得到的第1页是我第一次离开该页时。 下部导航栏是带有三个页面的Glyphish菜单（page_a，page_b，page_c）。当我从page1转到page_c，然后单击page1链接返回时（或什至当我使用JQM默认\“ back \”按钮）时，会发生问题，page1的CSS中断，既不显示标题导航栏也不显示第一个可折叠的，而是将第一可折叠H1的内容与第二可折叠H1的内容混淆合并。 一旦动态填充列表视图（每次调用pageshow（）之后），我就使用listview（）刷新列表视图。 我有不同的尝试来解决问题，其中之一是在逐渐消失的可折叠项目上使用page（），但是没有用。 值得一提的是，我是直接在Webkit浏览器上的设备Blackberry Bold 9700上进行开发的。但是，该功能在桌面浏览器Firefox 4，Chrome及其扩展Ripple上运行良好。 如果有人遇到此类问题并设法解决，我将很感激您的见解/解决方案。 干杯。 [编辑]按照cpak提供的链接，我将以下CSS规则添加到了自定义css文件中，它设法解决了该问题。

    .ui-mobile [data-role=page],.ui-mobile [data-role=dialog],.ui-page { height:0; overflow:hidden}

.ui-mobile .ui-page-active { display: block; overflow: visible; height:auto; min-height:100%;}

然后，我一起删除了上述规则，并使用了最新构建的JQM（默认情况下解决了该问题）。对于在那里的任何人，当我遇到此问题时，我都在使用v1.0a4.1，但似乎在最新版本的JQM（日期为5月24日）中已修复。     

解决方法

在#home页面和Chrome和MobileSafari中的其他页面之间来回切换但在本机Android浏览器中却没有这样的问题。 几天前发现了这一点： 使用jQuery Mobile的“后退”按钮时，主页布局在Safari和MobileSafari中搞砸了 我还没有时间尝试一下，但这可能与您遇到的情况有关。 [编辑]：重新阅读您的问题后，我不确定这是否会对您有所帮助，但是无论如何，我都会把帖子留在这里，供社区决定=）