<!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. calico docker 应用实例

    在上一篇文章<quay.io/coreos/etcd 基于Docker镜像的集群搭建>中,介绍了ETCD集群的搭建.在此基础上,我们进一步实践calico docker的应用. PaaS ...

  2. dom4j-1.6.1.jar与dom4j-1.4.jar

    今天在上线的项目中遇到一个很奇怪的问题 File file = new File("O:/20160817/91a2cb1c-62eb-4a31-a1f6-3af8ab71782a/adi6 ...

  3. 如何做个简单安卓App流程

    有同学做毕业设计,问怎样做个简单安卓App流程,我是做服务端的,也算是经常接触app,想着做app应该很简单吧,不就做个页面,会跳转,有数据不就行了,我解释了半天,人家始终没听懂,算了,我第二天问了下 ...

  4. 在虚拟机发布网站，设置服务器外网访问ip端口号

    这是虚机上的发布网站的网站端口号 这一步要在实机设置 做完这一步,在外网就可以访问你刚刚发布的站点了

  5. 关于JQ的$.deferred函数。参考网络文档

    由于jQuery版本问题对Deferred对象的实现有所不同,具体请参照jQuery api:   jQuery.Deferred()基于Promises/A规范实现,因为jQuery本身的设计风格, ...

  6. json根据key取values

    function getJson(key, jsonObj) { for (var item in jsonObj) { if (item == key) { //item 表示Json串中的属性,如 ...

  7. PetaPoco入门(一）

    1. ORM概括 1.1. ORM简介 ORM 对象-关系映射(Object/Relation Mapping,简称ORM),是随着面向对象的软件开发方法发展而产生的.面向对象的开发方法是当今企业级应 ...

  8. bat 自动编译运行

    @echo off g++ %1 -Wall -Wextra --std=c++98 -O3 -DNDEBUG -D_NDEBUG -D_GLIBCXX_NO_ASSERT ^ -U_STLP_DEB ...

  9. Less 使用指南

    简而言之 Less是为了简化css http://less.bootcss.com/features/ 以上链接是Less中文网站,里面有对Less的详细介绍. 一下写在使用中遇到的问题: 1.下载L ...

  10. Winform开发框架之介绍

    winform开发框架,尽量减少程序员在界面中的代码量和工作量,Model自动生成,界面以及控件自动生成,简单的逻辑自动生成.自动生成的界面已经实现简单逻辑增删改查功能. 其他开发框架都已经或多火烧实 ...