【问题标题】：How to dynamically build list view JQueryMobile如何动态构建列表视图 JQueryMobile
【发布时间】：2012-02-03 22:38:21
【问题描述】：

我需要动态添加一个列表视图。我能够动态构建列表视图，但我正在追加

到下面的 html sn-p 中的硬编码标记。

The HTML code snippet.
<ul id="mymenu" data-role="listview" >
</ul>

Jquery Code Snippet.
$("#accpmenu").append('<li><a href='+ "#" + ' id="a"  "> <img src="letterheader.png" >'+ this.textContent + '  </a> </li>');

我什至想动态构建然后追加

请帮助我实现这一目标。

谢谢夏姆

【问题讨论】：

你基于什么动态构建？如果您使用服务器端脚本从文件或数据库返回数据，并且您希望根据该文件或数据库的内容动态构建，请在服务器端脚本中使用 for() 或 while() 循环。

标签： jquery jquery-mobile

【解决方案1】：

我使用下面的代码对我来说很好

动态列表视图

<script>


var myArray = ["Arun", "kumar", "Mani", "Vimal", "Vinoth"];

$.each(myArray, function(index, value){

    console.log("INDEX: " + index + " VALUE: " + value);


});


         var output = [];

    for (var i = 0; i <myArray.length; i++) {


       output.push('<li><img src="img/img_help.png">' + myArray[i] +'</li>');

    }

     $('#coursemates').append(output.join('')).listview('refresh');

     $("#coursemates").listview("refresh");

</script>

【讨论】：

【解决方案2】：

添加后必须刷新列表：

  $("#mymenu").listview("refresh");

【讨论】：

【解决方案3】：

这是一个动态创建列表的示例。

http://jsfiddle.net/SuSpv/

如果有帮助，请告诉我。

【讨论】：

我用你的例子来帮助编写我自己的实现，但我得到一个错误，“无法在初始化之前调用 listview 上的方法；试图调用方法 'refresh'。我的列表视图项包含锚标记它调用了一个javascript函数。你认为这是我的问题吗？你能提出一个解决方案吗？