标签：blog http ar 使用 sp strong on 数据 div
jQuery Mobile的世界里，列表就是页面中的一个有序（ol元素）或（ul元素）列表，其中至少包含一个列表项（li元素），并且使用html5语法data-role="listview"将对应的role的值定义为listview。
4.1整页列表与插入列表
默认情况下列表使用整页模式，有时会用到与其他html内容混合的列表，这会就用到jQuery Mobile提供了内联列表，要定义这种列表，只需在对应的ul或ol元素上添加data-inset="true"。
4.2 视觉分隔符
data-role=“list-divider”。分组，例如 GroupA、GroupB等
代码：
<ul data-rol="listview">
<li data-role="list-divider">Group A</li>
<li>argentina</li>
<li data-role="list-divider">Group A</li>
<li>argentina</li>
</ul>
4.3 交互行
如果一个列表元素包含a元素，则该行会被转换为一个可影响触摸及、或鼠标导航的交互行。整行都为链接。同一列表中可以使用交互行和只读行。
修改列表右侧的图标，可用data-icon属性。
4.3.1 内嵌列表
li中可以嵌套ul或ol，可以设置自定义主题。嵌套层级没有限制。
4.3.2分割按钮列表
jQuery Mobile 使用了"分割行"控件。如果一个列表项li包含两个超链接（a元素），则它将被自动当做分割行处理。
常见的是一个详情操作和一个编辑操作。自己想象下吧。
data-split-theme为右边的图标定义不同的主题。
data-split-icon来修改第二个操作的图标，应用在列表自身（ul或ol元素）。
控制行的重要程度：
重要：可将标题包含在hx标签中。
不重要：包含在p标签中。
4.4 使用图片
4.4.1 行图标
行图标是显示在行标题左侧的图片，与交互行右边的箭头或分隔符的图标不是一个。
4.4.2 缩略图
缩略图是一个80*80像素的图片，位于文本左侧。例如，新闻标题。缩略图由列表项中的图片定义，不需要任何特殊的类。
4.5 附加内容
为每一行加一个次级列，用于补充信息。可以使用ui-li-aside类的html元素来实现。常用的如span或div元素。样子像是显示在右上角的小文字。
4.6 标题与描述
同一行上显示标题与描述，可将标题放在hx标题里，文本放在p元素里。他们会被渲染成两行。
4.7 使用计数气泡
在列表行中使用任意带ul-li-count属性的元素。 在右侧显示一个包含数字的圆圈。也可以显示文本，不过不建议使用，因为数字值是优化过的。
4.8 使用搜索过滤数据
属性：在ul或ol元素上加data-filter=“true”
总结：
4列表
标签：blog http ar 使用 sp strong on 数据 div
原文地址：http://www.cnblogs.com/anlen/p/4151645.html
