嵌套Listview的jQuery Mobile Collapsible无法正确显示

时间:2013-08-13 13:14:23

标签: jquery css html5 jquery-mobile

我是jQueryMobile的新手并且迫使我无法单独解决问题。

我有一个HTML表单,非常大(约100个字段)。为了提高可用性,表单分为4个部分,分别位于4个JQM页面上。在每个页面上,我都有相同的菜单,其中包含显示用户的可折叠集。如果单击某个用户,则可以看到每个用户的报告(列表视图)。

$(document).ready - 事件我正在调用load_users函数来从数据库中检索所有用户及其报告。通过这些数据,我建立了可折叠和列表视图,最后我打电话给     $(".listview:visible").listview().listview("refresh"); $(".menu:visible").collapsibleset("refresh"); 正确显示可折叠和列表视图。因为菜单是同时在所有四个页面上构建的,所以我不得不添加:visible-pseudoclass。

现在,当我向数据库插入新用户时会出现问题。插入工作正常。之后,我从菜单中删除所有元素,然后再次调用load_users()再次填充菜单。但之前有效的是在一个没有预期造型的普通列表中结束。

任何人都可以给我一个提示,让我可以让JQM正确显示我的折叠和列表视图吗?

1 个答案:

答案 0 :(得分:2)

当您在jQuery Mobile中手动添加html时,您需要告诉它重新执行在页面创建期间完成的增强功能。

要执行此操作,请调用将重新创建窗口小部件的.listview()构造函数,而不是仅刷新的.listview('refresh')。还要确保在重新创建任何标记时添加data-role属性。

最后不要使用$(文档).ready它会导致JQM导航出现问题,而是使用$('#mypageid').on('pageinit', function(){});

http://api.jquerymobile.com/category/events/