ListViewの入れ子

ListViewは入れ子にもできる。

<ul data-role="listview">
<li>果物
	<ul>
	<li>みかん</li>
	<li>りんご</li>
	<li>なし</li>
	<li><a href="#" data-rel="back" data-direction="reverse" data-icon="arrow-l">戻る</a></li>
	</ul>
</li>
<li>野菜
	<ul>
	<li>白菜</li>
	<li>ブロッコリー</li>
	<li>キャベツ</li>
	<li><a href="#" data-rel="back" data-direction="reverse" data-icon="arrow-l">戻る</a></li>
	</ul>
</li>
</ul>

アコーディオン形式にする手もある。

<div data-role="collapsible-set" data-content-theme="f">
	<div data-role="collapsible" data-collapsed="false">
	<h3>Section 1</h3>
	<ul data-role="listview">
		<li>みかん</li>
		<li>りんご</li>
		<li>なし</li>
		<li><a href="#" data-rel="back" data-direction="reverse" data-icon="arrow-l">戻る</a></li>
	</ul>
	</div>

	<div data-role="collapsible">
	<h3>Section 2</h3>
	<ul data-role="listview">
		<li>みかん</li>
		<li>りんご</li>
		<li>なし</li>
		<li><a href="#" data-rel="back" data-direction="reverse" data-icon="arrow-l">戻る</a></li>
	</ul>
	</div>
</div>