<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width,initial-scale=1.0">

    <title>Title</title>

    <script src="../jquery-2.2.4.min.js"></script>

    <script src="jquery.mobile-1.4.5.min.js"></script>

    <link type="text/css" rel="stylesheet" href="jquery.mobile-1.4.5.min.css">

</head>

<body>

<div data-role="page">

    <div data-role="header" data-position="fixed"><h1>这是头部</h1></div>

    <div role="main" class="ui-content">

        <!--普通listView-->

        <ul data-role="listview">

            <li><a>A</a></li>

            <li><a>B</a></li>

            <li><a>C</a></li>

            <li><a>D</a></li>

        </ul>

        <br/>

        <!--具有搜索功能的listView-->

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

            <li><a>A</a></li>

            <li><a>B</a></li>

            <li><a>C</a></li>

            <li><a>D</a></li>

        </ul>

        <br>

        <!--过滤搜索隐藏列表-->

        <ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search Alphabet">

            <li><a>A</a></li>

            <li><a>B</a></li>

            <li><a>C</a></li>

            <li><a>D</a></li>

        </ul>

        <br/>

        <!--过滤搜索隐藏列表,另一种写法-->

        <form class="ui-filterable">

            <input id="auto-input" data-type="search" placeholder="Search Alphabet">

        </form>

        <ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search Alphabet"

            data-input = '#auto-input'>

            <li><a>A</a></li>

            <li><a>B</a></li>

            <li><a>C</a></li>

            <li><a>D</a></li>

        </ul>

    </div>

    <div data-role="footer" data-position="fixed">

        <h1>这是底部</h1>

    </div>

</div>

</body>

</html>

　　

jQueryMobile控件之ListView的更多相关文章

  1. 与众不同 windows phone (52) - 8.1 新增控件: AutoSuggestBox, ListView, GridView, SemanticZoom

    [源码下载] 与众不同 windows phone (52) - 8.1 新增控件: AutoSuggestBox, ListView, GridView, SemanticZoom 作者:webab ...

  2. 重新想象 Windows 8 Store Apps (11) - 控件之 ListView 和 GridView

    原文:重新想象 Windows 8 Store Apps (11) - 控件之 ListView 和 GridView [源码下载] 重新想象 Windows 8 Store Apps (11) - ...

  3. winform利用ImageList控件和ListView控件组合制作图片文件浏览器

    winform利用ImageList控件和ListView控件组合制作图片文件浏览器,见图,比较简单,实现LISTVIEW显示文件夹图片功能. 1.选择文件夹功能代码: folderBrowserDi ...

  4. UI控件之ListView

    一,一个简单的TextView列表 public class FirstActivity extends Activity { private String[] data = {"Apple ...

  5. Android基本控件之listView(三)<用ListView实现分页加载>

    我们之前讨论了ListView的基本使用方法和ListView的优化 今天我们再来讨论一个关于ListView的一个新的东西~就是分页加载.那么什么是分页加载呢?简单点说,就是"下拉刷新&q ...

  6. Android基本控件之ListView（二）<ListView优化>

    之前我们说到ListView的基本用法.但是,有很多的时候会额外的占用一些内存,从而消耗了性能.既然有消耗性能的可能,那么我们就对其做出相应的优化 我们首先来说说优化的步骤: 第一步.将宽和高设置为填 ...

  7. Android基本控件之ListView（一）

    我们在使用手机的时候,通常看到,像通讯录,QQ列表样式的东西,这里来解释一下,其实那些都是一个ListView 今天,我们就来详细的讲解一下ListView这个控件 ListView中每条显示的数据都 ...

  8. android 在一个scrollView里面嵌套一个需要滑动的控件（listView、gridView）

    package cn.via.dageeeOrderFood.widget; import android.content.Context; import android.graphics.Point ...

  9. Android控件开发——ListView

    上篇博客解决了Android客户端通过WebService与服务器端程序进行交互的问题,这篇博客重点关注两个问题,一个是Android应用程序如何与本机文件型数据库SQLite进行交互,另一问题则是如 ...

随机推荐

  1. C#:判断软件运行的环境是否是Pad（PC）

    一.需求:Pad上显示某功能块,PC机上隐藏. 二.方法:从外围设备获取值判断是否是Pad. 三.具体参考代码如下: 1.外围设备值类型如下: public enum ChassisTypes { O ...

  2. asp.net 之 数据库导入treeview

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We ...

  3. -webkit-transform:scale(1.04)放大缩小效果

    <p>[鼠标移动进去图片放大一倍效果:运用了-webkit-transform:scale(1.04)效果]</p> 如图:鼠标移动上去的时候图片放大一倍的效果, <!D ...

  4. python学习之列表语法

    1.列表 1 list.append(obj)在列表末尾添加新的对象2 list.count(obj)统计某个元素在列表中出现的次数3 list.extend(seq)在列表末尾一次性追加另一个序列中 ...

  5. struct内存对齐1：gcc与VC的差别

    struct内存对齐:gcc与VC的差别 内存对齐是编译器为了便于CPU快速访问而采用的一项技术,对于不同的编译器有不同的处理方法. Win32平台下的微软VC编译器在默认情况下采用如下的对齐规则:  ...

  6. Bootstrap_响应式网格系统

    首先添加CSS样式: [class *= col-]{ background-color: #eee; border: 1px solid #ccc; } [class *= col-] [class ...

  7. Writing Text Files On The Client in Oracle Forms 10g

    Below is the example to write file on client in Oracle Forms 10g with webutil library package.Note:  ...

  8. iOS - CocoaPods 第三方开源框架管理

    1.CocoaPods CocoaPods 是一个负责管理 iOS 项目中第三方开源库的工具.CocoaPods 的项目源码在 Github 上管理.该项目开始于 2011 年 8 月 12 日,在这 ...

  9. 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动

    一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...

  10. PHP 小方法之 仿百度蜘蛛采集

    if(!function_exists('_GetContent')){ function _GetContent( $url ){ $ch = curl_init(); $ip = '220.181 ...