Jquery mobile jquerymobile：如何使页面具有两个独立的可滚动区域

我正在使用jquerymobile，希望将页面分为两个区域：列表和详细信息。所以我用两个柱网来做。但有时列表或/和细节区域对于屏幕来说太长了，我希望两个区域都能独立滚动，最好使用jquery工具，这样滚动一个区域不会影响另一个区域

有人有想法吗？

解决方案1 创建内容div

data role=“content”

以及直接在

data role=“page

下创建的内容div。设置

max height

值并

overflow-y:scroll；

.ui-content {
  max-height: 150px !important;
  overflow-y: scroll;
}

解决方案2 在主内容div

data role=“content”

内，添加内容div并覆盖其

max height

和

overlfow-y

仅覆盖父内容div

.ui-content .ui-content {
  max-height: 150px !important;
  overflow-y: scroll;
}

---

如果我想让列表具有过滤器，是否可以让列表滚动和过滤器输入保持在顶部？@Daniel您可以修复它，但我不确定此解决方案是否能在所有移动设备上工作。信息可能会有所帮助-我们希望使用phoneGap，所有列表都是在JS中动态构建的。我想，基于您的解决方案，包含wlistview的ul部分需要rapper。问题是，如何将其压缩到列表中。@Daniel您也可以根据列表项的长度动态执行此操作。您可以动态调整创建的包装高度。我正在尝试修复过滤器，但由于它是动态创建的，因此需要彻底测试。我认为，包装高度取决于窗户的高度，像这里