jquery mobile属性

<div data-role="collapsible" data-collapsed="false">
      <h1>点击我-我可以折叠</h1>
      <p>折叠内容</p>
</div>

data-role = "collapsible"    可折叠的属性

data-collapsed = “false” 默认是加载的时候不折叠 点击之后折叠

折叠属性可以嵌套折叠属性

<div data-role="content">
                <p>content</p>
                <div data-role="collapsible" data-collapsed="true">
                    <h1>点击我-我可以折叠</h1>
                    <div data-role="collapsible" data-collapsed="false">
                        <h1>第二层折叠</h1>
                        <p>第二层折叠的内容</p>
                    </div>
                </div>
            </div>

data-role="listview" 列表视图

data-autodividers="true"属性通过对列表项文本的首字母进行大写来创建分隔符。 

data-filter="true" 列表中添加搜索框

data-filter-placeholder 修改默认文本

<ul data-role="listview" data-autodividers="true" data-inset="true" data-filter="true" data-filter-placeholder="搜索姓名 ...">
                        <li><a href="#">Adele</a></li>
                        <li><a href="#">Agnes</a></li>
                        <li><a href="#">Albert</a></li>
                        <li><a href="#">Billy</a></li>
                        <li><a href="#">Bob</a></li>
                        <li><a href="#">Calvin</a></li>
                        <li><a href="#">Cameron</a></li>
                        <li><a href="#">Chloe</a></li>
                        <li><a href="#">Christina</a></li>
                        <li><a href="#">Diana</a></li>
                        <li><a href="#">Gabriel</a></li>
                        <li><a href="#">Glen</a></li>
                        <li><a href="#">Ralph</a></li>
                        <li><a href="#">Valarie</a></li>
                </ul>

class="ui-li-icon"     添加icon

<li><a href="#"><img src="us.png" alt="USA" class="ui-li-icon">USA</a></li>

class "ui-li-count" 属性并添加数字

<ul data-role="listview">
  <li><a href="#">Inbox<span class="ui-li-count">335</span></a></li>
  <li><a href="#">Sent<span class="ui-li-count">123</span></a></li>
  <li><a href="#">Trash<span class="ui-li-count">7</span></a></li>
</ul>