jquery mobile 移动web(4)
下拉菜单: 设置label 元素的for 属性为 select label 元素的文本内容作为选项的名称 定义div元素并设置data-role 属性值为 fieldcontain.
<div data-role="controlgroup">
<label for="select" class="select">请选择你的兴趣</label>
<select name="select" id="select">
<option>音乐</option>
<option>电影</option>
<option>体育</option>
<option>旅游</option>
</select>
</div>分组的选择菜单 要在select 元素制定optgroup。
<div data-role="controlgroup">
<label for="select">请选择你的兴趣：</label>
<select name="select" id="select" data-native-menu="true">
<optgroup label="娱乐类"/>
<option>音乐</option>
<option>电影</option>
<optgroup label="文体累"/>
<option>体育</option>
<option>旅游</option>
</select>
</div>禁用指定Option 数据项的选择菜单
<div data-role="controlgroup">
<label for="select">请选择你的兴趣：</label>
<select name="select" id="select" data-native-menu="true">
<optgroup label="娱乐类"/>
<option disabled="">音乐</option>
<option>电影</option>
<optgroup label="文体累"/>
<option>体育</option>
<option>旅游</option>
</select>
</div>普通连接列表
<div data-role="page">
<header data-role="header">
<h1>列表例</h1>
</header>
<div data-role="content">
<ul data-role="listview" data-theme="g">
<li><a href="#">List 1</a></li>
<li><a href="#">List 2</a></li>
<li><a href="#">List 3</a></li>
<li><a href="#">List 4</a></li>
</ul>
</div>
</div>多层次嵌套列表。
<div data-role="page">
<header data-role="header">
<h1>列表例</h1>
</header>
<div data-role="content">
<ul data-role="listview" data-theme="g">
<li>
<a href="#" data-add-back-btn="true">List 1</a>
<p >这是第一层</p>
<ul>
<li>
<a>subList 1 of 1</a>
<a>subList 1 of 2</a>
<a>subList 1 of 3</a>
</li>
</ul>
</li>
<li>
<a href="#" data-add-back-btn="true">List 2</a>
<p >这是第二层</p>
<ul>
<li>
<a>subList 2 of 1</a>
<a>subList 2 of 2</a>
<a>subList 2 of 3</a>
</li>
</ul>
</li>
<li>
<a href="#" data-add-back-btn="true">List 3</a>
<p >这是第三层</p>
<ul>
<li>
<a>subList 3 of 1</a>
<a>subList 3 of 2</a>
<a>subList 3 of 3</a>
</li>
</ul>
</li>
</ul>
</div>
</div>本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2015-12-20 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读