jQuery Mobile 实现苹果滑动删除闹钟功能的几点总结
1.jquery给动态添加的元素添加事件
在jquery推出新版本,使用.on()以前,我们会用.live()来为动态添加的代码绑定事件,但是现在jQuery用.on()替代了.live()
先看个.live()实例
$("a").live("click", function () {
$("#111").append("ok");
});
再看一个.on()的实例
$("body").on("click","a", function () {
$("#111").append("ok");
});
其中,.live()的用法跟1.7之前的.on()类似,而1.9的.on()方法是on(events,[selector],[data],fn) ,可以指定绑定在哪个父节点上,在后面的选择器内写上要出发的元素选择器
live原理:
.live()则是通过事件委托的方式来绑定到元素上的。更适合列表类型的,绑定到document DOM节点上。和.bind()的优势是支持动态数据。
2.event.originalEvent JQuery
今天在使用jquery的e.pageX时,发现其获得的值一直是undefined,百度了一下,换成了e.originalEvent.pageX就好了,问题是解决了,但是不知道原因,于是在Stack Overflow上搜了一下,在这里给大家翻译一下。
event.originalEvent是原生的js event,如果浏览器是兼容或者是在可触的设备上使用,API通常是暴漏给event.originalEvent。简单来说,event.originalEvent会根据触发时间类型和浏览器运行环境表现不一。
举个例子:
var files = event.dataTransfer.files; // Gives error: trying to get property of undefined var files = event.originalEvent.dataTransfer.files; // Works fine
jquery没有封装原生event对象的一些API,就行例子中的files。所以在这种时候我们需要使用event.originalEvent。
3.触摸事件
三种在规范中列出并获得跨移动设备广泛实现的基本触摸事件:
1. touchstart :手指放在一个DOM元素上。
2. touchmove :手指拖曳一个DOM元素。
3. touchend :手指从一个DOM元素上移开。
每个触摸事件都包括了三个触摸列表:
1. touches :当前位于屏幕上的所有手指的一个列表。
2. targetTouches :位于当前DOM元素上的手指的一个列表。
3. changedTouches :涉及当前事件的手指的一个列表。
例如,在一个touchend事件中,这就会是移开的手指。
这些列表由包含了触摸信息的对象组成:
1. identifier :一个数值,唯一标识触摸会话(touch session)中的当前手指。
2. target :DOM元素,是动作所针对的目标。
3. 客户/页面/屏幕坐标 :动作在屏幕上发生的位置。
4. 半径坐标和 rotationAngle :画出大约相当于手指形状的椭圆形。
jQuery Mobile 实现苹果滑动删除闹钟功能的几点总结的更多相关文章
- JQuery Mobile实现手机新闻浏览器(2)
在上一篇文章中,已经讨论了程序的结构和页面的布局,并简单介绍了一些jQuery Mobile的使用技巧.在本篇文章中,笔者将继续完成我们web应用的新闻浏览器的设计. 程序的启动 我们现在来研究一下程 ...
- jquery mobile多页面跳转等,data-ajax="false" 问题,
当我们的网站引用了jquery mobile的js后,点击页面的链接,你会发现页面无法跳转,因为jquery mobile默认是采用ajax方式来加载网站的,如果你需要跳到另一个页面,需要在a标签加上 ...
- jquery Mobile应用第2课《构建跨平台APP:jQuery Mobile移动应用实战》连载二(简单的QWER键盘)
在jQuery Mobile的布局中,控件大多都是单独占据页面中的一行,按钮自然也不例外,但是仍然有一些方法能够让多个按钮组成一行,比如说在范例6-5中就利用按钮分组的方法使4个按钮并列在一行中,如图 ...
- jQuery Mobile 入门基础教程
jQuery Mobile是jQuery在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架. jQue ...
- Jquery Mobile左右滑动效果
首先在一个页面里面定义两个< div data-role="page">,这里为了突出重点,就没有写出footer和header.定义的页面如下: <body&g ...
- 自定义listView添加滑动删除功能
今天研究了一下android里面的手势,结合昨天学习的自定义View,做了一个自定义的listview,继承自listView,添加了条目的滑动手势操作,滑动后出现一个删除按钮,点击删除按钮,触发一个 ...
- jquery mobile左右滑动切换页面
jquery mobile左右滑动切换页面 $(function() {$("body").bind('swiperight', function() { $.mobile.ch ...
- jQuery mobile 滑动打开面板
一.首先在<head></head>里面引入jQuery库.jQuery mobile库以及jQuery mobile样式 <link rel="stylesh ...
- Android滑动删除功能
今天学习了新的功能那就是滑动删除数据.先看一下效果 我想这个效果大家都很熟悉吧.是不是在qq上看见过这个效果.俗话说好记性不如赖笔头,为了我的以后,为了跟我一样自学的小伙伴们,我把我的代码粘贴在下面. ...
随机推荐
- 团队博客第三周(Running Duck队)
代码链接:Tetris 码云链接 一.需求&原型改进 1.原型改进 汉字方块每次可生成一个并逐渐下落 可通过触摸左右下滑动实现方块的左右移动和快速下滑 左上角按钮可对汉字进行暂时保存和替换 右 ...
- SpringMvc与Struts2的对比
目前企业中使用SpringMvc的比例已经远远超过Struts2,那么两者到底有什么区别,是很多初学者比较关注的问题,下面我们就来对SpringMvc和Struts2进行各方面的比较: 1.核心控制器 ...
- .net core webapi 定义多版本与 Swagger 的文档输出
前提: 需要nuget 以下两个程序集 Swashbuckle.AspNetCore 我暂时用的是 4.01: Microsoft.AspNetCore.Mvc.Versioning.ApiExp ...
- Git命令行学习积累
1.远程分支拉取到本地 $ git checkout -b develop origin/develop //检出远程的develop分支到本地 2.本地分支推送到远程 $ git checkout ...
- 开源应用框架BitAdminCore:更新日志20180903
索引 NET Core应用框架之BitAdminCore框架应用篇系列 框架演示:https://www.bitadmincore.com 框架源码:https://github.com/chenyi ...
- infopath 2007 升级到2013 栏目字段重复生成问题
1. 把Expense Statement.xsn的xsn扩展名改成zip.然后解压后会看到有一个mnifest.xsf. 2. 在vs 2013 中打开它. 3. Search for the fi ...
- squid代理缓存服务
man.linuxde.net 1.squid是Linux系统中的代理缓存服务,通常用作WEB网站的前置缓存服务,能够代替用户向网站服务器请求页面数据并进行缓存. 2.squid服务特点:配置简单.效 ...
- fatal: Not a git repository (or any parent up to mount point /home)
问题:fatal: Not a git repository (or any parent up to mount point /home) 解决:git init
- NOIP2012BLOCKADE贪心思想证明
NOIP2012BLOCKADE贪心思想证明 这道题的做法是二分时间并检验这个时间是否可行.检验的方法要用到贪心思想. 对于不能到根结点的军队应该尽量向根结点走. 如果军队A能走到根结点但到根结点后剩 ...
- “全栈2019”Java第八十九章:接口中能定义内部类吗?
难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...