listview
data-role=”listview”はul要素/ol要素をリスト形式に変換するメソッドです。
<ul data-role="listview">
<li><a href="acura.html">Acura</a></li>
<li><a href="audi.html">Audi</a></li>
<li><a href="bmw.html">BMW</a></li>
</ul>
作成されたリストには様々な設定が可能です。
構造化リスト
ul/liをネストして指定することで構造化されたリストを作成することができます。
<ul data-role="listview">
<li><div>Pets</div>
<ul>
<li><a href="index.html">Canary</a></li>
<li><a href="index.html">Cat</a></li>
<li><a href="index.html">Dog</a></li>
</ul>
</li>
<li><div>Farm animals</div>
<ul>
<li><a href="index.html">Chicken</a></li>
<li><a href="index.html">Cow</a></li>
<li><a href="index.html">Duck</a></li>
</ul>
</li>
<li><div>Wild animals</div>
<ul>
<li><a href="index.html">Aardvark</a></li>
<li><a href="index.html">Alligator</a></li>
<li><a href="index.html">Ant</a></li>
</ul>
</li>
</ul>
構造化リストではサブページ遷移時に”sample091.html#listview&ui-page=0-2″といったURLに変更されますがこの際のパラメータは$.mobile.subPageUrlKeyで変更可能です。
参考URL
jQuery Mobile Docs - Lists Overview
登録日 : 2012年11月08日 最終更新日 : 2016年12月19日