Muonekano wa Orodha ya jQuery Mobile

Muonekano wa Orodha ya jQuery Mobile

Kikaa ya orodha ya jQuery Mobile ni kikaa cha HTML kikuu: orodha yenye madai (ol) na yenye herufi (ul).

Kwa kumwambaa orodha, tuma data-role="listview" katika elementi ya <ol> au <ul>. Kwa kumaliza kufanya majadiliano kwa vyote, tuma kiungo kwa kila matukio ya orodha (<li>):

实例

<ol data-role="listview">
  <li><a href="#">Matukio ya orodha</a></li>
</ol>
<ul data-role="listview">
  <li><a href="#">Matukio ya orodha</a></li>
</ul>

亲自试一试

Kwa kuingia orodha kwa mabaki na mawakili, tumia propeti data-inset="true":

实例

<ul data-role="listview" data-inset="true">

亲自试一试

Mambo ya kuzingatia:Kwa msingi, matukio ya orodha yanatoka kwa upya kama mbinu (haukuwa na data-role="button").

Majaribio ya orodha

Majaribio ya orodha (List Dividers) inayotumiwa kusaidia kusandika na kusababisha kikundi cha majadiliano/kifungu.

Kwa kumweka majaribio ya orodha, tuma data-role="list-divider" katika elementi ya <li>:

实例

<ul data-role="listview">
 <li data-role="list-divider">Ujumbe
  <li><a href="#">Ufaransa</a></li>
  <li><a href="#">Jermani</a></li>
</ul>

亲自试一试

Kama orodha yako inayotokana na madai (kama orodha ya wasimamizi), jQuery Mobile inaongeza majaribio ya kawaida kwa herufi, kwa kufanya data-autodividers="true" katika elementi ya <ol> au <ul>:

实例

<ul data-role="listview" data-autodividers="true">
  <li><a href="#">Adam</a></li>
  <li><a href="#">Angela</a></li>
  <li><a href="#">Bill</a></li>
  <li><a href="#">Calvin</a></li>
  ...
</ul>

亲自试一试

Mambo ya kuzingatia:Propeti data-autodividers="true" inatokana na kufungua majaribio kwa herufi ya kwanza ya matukio ya orodha.

Mchakato wa tafuta

Kwa kuzingatia kifungu cha tafuta kwenye orodha, tumia propeti data-filter="true":

实例

<ul data-role="listview" data-filter="true"</ul>

亲自试一试

Kwa msingi, matukio ya kifungu cha tafuta ni "Kigeuka viwango...".

如需修改默认文本，请使用 data-filter-placeholder 属性：

实例

    data-filter-placeholder="搜索姓名">

亲自试一试

更多实例

只读列表
如何创建没有链接的列表（不是按钮，不可点击）。