jquery mobile 移动web(6)
jquery mobile 针对移动端设备的事件类型。 1.touch 事件。 tap 快速触摸屏幕并且离开,类似一种完整的点击操作。 taphold 触摸屏幕并保持一段时间。 swipe 在1秒内水平移动30px屏幕像素上时触发。 swipeleft 向左侧滑动 swiperight 像右侧滑动。 2.方向改变事件 orientationchange 事件函数当移动设备的方向发生改变触发,在事件的回调函数内的第二个参数返回一个用于识别当前方向的参数, 该参数有两种返回值:portrait(纵向)landscarp(横向)。 3.滚动事件, scrollstart 开始滚动时候触发该事件。 scrollend 滚动结束时触发该事件。 4.显示/隐藏 pagebeforeshow 当视图通过动画效果开始显示在屏幕之前触发事件。 pagebeforehide 当视图通过动画效果开始隐藏之前触发事件, pageshow 当视图通过动画效果显示在屏幕之后触发事件。 pagehide 当视图通过动画效果隐藏后触发。
示例代码:
$("div").live("pageshow",function(event,ui){
alert("this page just hidden"+ui.prevPage)
})
5.模拟鼠标事件 vmouseover 统一处理触摸和鼠标悬停事件。 vmousedown 统一处理触摸和鼠标按下事件。 vmousemove 统一处理触摸和鼠标移动事件。 vmouseup 统一处理触摸和鼠标按键松开事件。 vclick 统一处理触摸和鼠标点击事件。 vmousecancel 统一处理触摸和鼠标l离开事件。
页面视图辅助工具 1. $.mobile.changePage 通过函数编程的方式改变两个视图之间切换效果。通常在点击超链接或提交表单的时候自定义切换效果。 语法: $.mobile.changePage(to,options); to 是必选参数, 可以传递的参数类型包括字符串,对象。 options 可选,传递的是一个JSON 数据格式对象, 用法: 以下实例将改变decondPage.html 的页面效果
$.mobile.changePage("secondPage.html",{
transition:"slidedown"
})
表单提交操作
$.mobile.changePage("submit.php",{
type:"post";
data:$("form#add").seriaize();
})
2.$.mobile.loaPage 主要的作用是加载外部页面,并插入当前页面的DOM元素内。 $.mobile.loadPage(url,options); url 是一个必选参数,传递一个绝对或者相对的 URL 地址 options 可选参数,传递的是一个JSON 数据对象。
示例: $.mobile.loadPage("secomdPage.html"); 提交表单并加载结果页面:
$.mobile.loadPage("result.php",{
type:"get",
data:$("form#search").serizlize();
})
数据存储: 1.jqmData()方法; 可以在元素上绑定任意数据。 $.mobile.jqmData(element,key,value) element 参数是指定需要绑定数据的元素; key 需要绑定数据的属性名, value 绑定的数据。 2.jqmRemoveData() 方法: 该方法是移除绑定在元素上的data数据, $.mobile.jqmRemoveData([name]) name 是可选参数,指定需要移除哪个data属性,如果不穿参数,则需要移除元素上的所有数据。 3.jqmHasData() 方法 判断元素上是否存在绑定 的数据, $.mobile.jqmHasData(element); element 参数是一个进行数据检查的DOM元素。
地址路径辅助工具: 1.解析URL 地址 $.mobile.path.parseUrl 函数解析一个Url 指定, 并返回一个含有所有参数值的对象,让我们很轻易的访问Url地址上的参数属性。 parseUrl 函数的语法 $.mobile.path.parseUrl(url); url 参数是一个相对或者绝对的URL地址,必选传入的参数。 parseUrl 函数返回一个对象,对象内包含丰富的属性。 属性: hash 说明:#号后面的所有的字符内容,相当于location 的hash 属性: host 说明:URL的主机名和端口号 属性: hostname 说明:返回只包含URL 的主机名。 属性: href 说明:返回整个URL地址。 属性: pathname 说明:返回文件或目录的关联路径 属性: port 说明:请求返回Url的端口号 属性:portocol 说明:返回请求Url 地址的协议,如 http https 属性:search 说明:返回地址中“?”后面的请求参数 属性:authority 说明:返回用户名,密码,主机名,端口号组成的地址, 属性:directiry 说明:返回请求URL地址的目录路径, 属性:domain 说明:返回 protocal 协议和authority 组成的路径 属性:filename 说明:返回请求的Url文件名 属性:hrefOfHash 说明:返回不包含hash 值的URL 路径。 属性:hrefOfSearch 说明:返回不包含请求参数和hash值的URL 路径。 属性:password 说明:返回请求URL 中的密码 如ftp 协议密码。 属性: username 说明:返回请求URL中的用户名,如ftp 协议的用户名。
loading 显示/隐藏 显示loading 对话框的方法是 $.mobile.showPageLoadingMse(); 隐藏loading 对话框的方法是 $.mobile.hidePageLoadingMse();
- 一个关于反序列化的小问题
- 两个简单的扩展方法:TrimPrefix和TrimSuffix
- 谈谈Nullable<T>的类型转换问题
- ASP.NET MVC是如何运行的(3): Controller的激活
- ASP.NET MVC是如何运行的[2]: URL路由
- 一个简单的小程序演示Unity的三种依赖注入方式
- 在Entity Framework中使用存储过程(三):逻辑删除的实现与自增长列值返回
- 在Entity Framework中使用存储过程(四):如何为Delete存储过程参数赋上Current值?
- ASP.NET MVC是如何运行的(4): Action的执行
- ASP.NET MVC是如何运行的[1]: 建立在“伪”MVC框架上的Web应用
- 在Entity Framework中使用存储过程(五):如何通过存储过程维护多对多关系?
- ASP.NET MVC下基于异常处理的完整解决方案
- 不到40行代码构建正则表达式引擎
- 随便写一篇文章
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法