jQuery Mobile 列表视图
列表视图:是一种标准的HTML列表,分为有序列表(<ol>)和无序列表(<ul>)
创建: data-role="listview" 默认地,列表中的列表项 <a>会自动转换为按钮(无需data-role="button")
为列表添加圆角和外边距:data-inset="true"
e.g.
<div data-role="content">
<h2>有序列表:</h2>
<ol data-role="listview" data-inset="true">
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
</ol>
<h2>无序列表:</h2>
<ul data-role="listview">
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
</ul>
</div>
列表分隔符:data-role="list-divider"
e.g.
<ul data-role="listview">
<li data-role="list-divider">欧洲</a></li>
<li><a href="#">法国</a></li>
<li><a href="#">德国</a></li>
</ul>
data-autodividers="true" // 通过对列表项文本的首字母进行大写来自动创建分隔符
e.g.
<ul data-role="listview" data-autodividers="true">
<li><a href="#">Angela</a></li>
<li><a href="#">Boby</a></li>
<li><a href="#">Mary</a></li>
<li><a href="#">Silina</a></li>
</ul>
搜索过滤器:data-filter="true" 会在列表上方添加搜索框
data-filter-placeholder="搜索框中的文本" //可自定义,默认是“Filter items...”
e.g.
<ul data-role="listview" data-autodividers="true" data-inset="true" data-filter="true" data-filter-placeholder="输入搜索条件">
<li>.....</li>......
</ul>
创建没有链接的列表:去掉<a>,简单使用文本代替内容
e.g.
<ul data-role="listview">
<li>item1</li>
<li>item2</li>
</ul>
jQuery Mobile 列表视图相关推荐
- 使用 jQuery Mobile 与 HTML5 开发 Web App (七) —— jQuery Mobile 列表
如 Kayo 之前所写的文章 <使用 jQuery Mobile 与 HTML5 开发 Web App -- jQuery Mobile 内容格式> 中所述,这次介绍的是 jQuery M ...
- w3cschool的jQuery Mobile教程总结
w3cschool的jQuery Mobile教程总结 jQuery Mobile 是针对触屏智能手机与平板电脑的网页开发框架. jQuery Mobile 工作于所有主流的智能手机和平板电脑上. 一 ...
- jQuery Mobile 教程
http://www.w3school.com.cn/jquerymobile/jquerymobile_icons.asp jQuery Mobile 教程 jQuery Mobile 教程 jQu ...
- jQuery mobile插件基础知识笔记
一.简介 1.Jquery mobile是针对触屏智能手机与平板电脑的website以及在线应用的前端开发框架. jQuery mobile是一个触控优化的HTML5 UI框架,旨在让所有智能手机.平 ...
- jquery mobile php,jQuery Mobile 实例
jQuery Mobile 实例 jQuery Mobile 页面 一个基本的移动网页 多个页面 对话框 jQuery Mobile 页面切换 淡入效果 从后向前翻转效果 流动效果 弹出效果 滑动效果 ...
- 在jquery mobile制作app的几个页利用ajax将后台数据json数组动态加载到列表里面
2019独角兽企业重金招聘Python工程师标准>>> 后来查找资料,发现新增节点后虽然数据加载上去了,但是样式却没有加载上,因此在整个过程中有2个注意事项. 1.利用循环将json ...
- jQuery Mobile中列表项ol、ul中的li的data-*选项
全栈工程师开发手册 (作者:栾鹏) jQuery Mobile 所有data-*选项 jQuery Mobile中列表项li的data-*选项 //带有 data-role="listvie ...
- jQuery Mobile中列表listview(ol、ul)的data-*选项
全栈工程师开发手册 (作者:栾鹏) jQuery Mobile 所有data-*选项 jQuery Mobile中列表listview的data-*选项 //带有 data-role="li ...
- WebApp之JQuery Mobile实现火车列表信息查询
一.项目源代码如下: <!-- --><!DOCTYPE html> <html> <head><meta charset="utf-8 ...
最新文章
- vue element 导出blob后台文件流xlsx文件自动下载(且规避乱码)
- 容量是GPT-2的1.7倍!谷歌打造神经对话模型Meena
- 解析 Java 类和对象的初始化过程 由一个单态模式引出的问题谈起
- c语言教程常用32,几个常用运算符
- 【深度学习mmdetection错误】——mmdetection 运行报错KeyError:‘ConvWS is already registered in conv layer‘
- 随机漫步(random walk)
- BIO,NIO,AIO总结(一)
- idea编译后target文件不全_IntelliJ IDEA 不能更新target中的java等部分文件
- 更改ubuntu的mysql版本为指定版本
- ruby中文文档下载
- 【Spring 5】响应式Web框架实战(上) 1
- 读书笔记(英文) The Ngihtingale and Rose
- 我国计算机系统安全保护等级的划分,规范《GB17859-1999-计算机信息系统安全保护等级划分准则》.pdf...
- Equalize the Array(思维)
- python用两分钟告诉你,怎样暴力破解隔壁老王的 WiFi 密码
- Node.js 高级篇(六):手把手教你使用和理解 Multer 实现文件上传,包懂 O(∩_∩)O~
- 《程序员练习生》第2期 什么年龄开始编程最好
- matlab 实现二值图像孔洞填充函数imfill()
- postman 的一些深度功能
- mysql 定时任务 每月_mysql 定时任务 每月15号执行
热门文章
- 初三毕业班主任压力过大割喉自尽
- 非视距成像:硬件设备总结
- JAVA JDK源码在线阅读
- 7-4 房产税费计算2022 (12 分)
- 均值定理最大值最小值公式_数学均值定理怎么求不等式的最大值最小值,求教会(ฅω*ฅ)...
- blas、lapack、atlas在Ubuntu上的安装
- np.array的axis进行横向纵向的求和运算
- CSS解决hover选择器生硬效果
- 亚声速 – 超声速等熵喷管流动 数值模拟(文字)
- 中央电大c 语言程序设计本科试题,中央电大本科C语言程序设计试题2013年1月.pdf...