填充jQuery Mobile的ListView的本地JSON数据

问题描述

我试图填充本地JSON信息的JQM的ListView。但是，创建没有列表项。任何帮助将是AP preciated。这里是我的code：

JSON文件结构：

  [
{
名：测试
卡路里：1000
胖：100
蛋白质：100
碳水化合物：800
}，
{
名：TEST2
卡路里：10000
胖：343
蛋白质：3434
碳水化合物：4343
}
]
 

HTML：

 ＆LT; D​​IV数据角色=页面数据标题=搜索ID =searchPage＆GT;
      ＆LT; UL数据角色=列表视图数据插入=真正的ID =searchFood＆GT;
      ＆LT; / UL＆GT;
＆LT; / DIV＆GT;
 

JS：

的（更新）的

 的$（document）。在（pageinit，#searchPage功能（）{
  $ .getJSON（../ JS / food.json功能（数据）{
        无功输出='';
        $。每个（数据，功能（指数值）{
         输出+ ='＆LT;立GT;＆LT; A HREF =＃＆GT;' + data.name +'＆LT; / A＆GT;＆LT; /李＆GT;';
        }）;
        $（'＃searchFood'）HTML（输出）.listview（刷新）;
  }）;
}）;
 

解决方案

首先，返回的 JSON 的阵列是错的，值（属性）应该用逗号分隔。

  VAR数据= [{
    名：测试，
        卡路里：1000，
        胖：100，
        蛋白质：100，
        碳水化合物：800
}，{
    名：TEST2
        卡路里：10000，
        胖：343
        蛋白质：3434，
        碳水化合物：4343，
}];
 

第二个错误，你应该阅读 $返回值对象。每个（）函数不是数据阵列。

  $。每个（数据，功能（指数值）{
  输出+ ='＆LT;立GT;＆LT; A HREF =＃＆GT;' + value.name +'＆LT; / A＆GT;＆LT; /李＆GT;';
}）;
 

jQueryMobile不仅提高一次，当它被加载页面。当新的数据被动态地添加到页面，jQueryMobile必须知道该数据的数据被增强的。

从的 JSON 的数组中提取数据后，追加他们，那么的刷新的列表视图来restyle新添加的元素。

  $（'＃searchFood'）HTML（输出）.listview（刷新）;
 

这篇关于填充jQuery Mobile的ListView的本地JSON数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！