zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    rsync安装配置实时同步
    ORA-00392: log 4 of thread 2 is being cleared, operation not allowed
    CentOS 6.4安装配置LNMP服务器(Nginx+PHP+MySQL)
    ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock'
    常见服务端口
    linux客户端传输文件到Windows本地
    windows/Linux主机重启NetBackup服务和后台进程
    linux命令之grep命令
    linux命令之awk命令
    Shiro安全框架
  • 原文地址:https://www.cnblogs.com/nmxs/p/5058448.html
Copyright © 2011-2022 走看看