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 :画出大约相当于手指形状的椭圆形。

时间: 2024-10-21 18:00:33

jQuery Mobile 实现苹果滑动删除闹钟功能的几点总结的相关文章

jQuery easyUI 1.3.2 删除编辑功能 行号混乱的bug

最近使用jQuery easyUI 1.3.2 开发.在记录行设置一操作列,包含删除和编辑功能,操作后不reload重载(不发送新的数据库查询请求).网上教程是在初始化数据的时候,将行号index传入,如下代码 formatter:function(value,row,index){ if (row.editing){ var s = '<a href="javascript:void(0);" class="savebtn" onclick="sa

jquery Mobile应用第2课《构建跨平台APP:jQuery Mobile移动应用实战》连载二(简单的QWER键盘)

在jQuery Mobile的布局中,控件大多都是单独占据页面中的一行,按钮自然也不例外,但是仍然有一些方法能够让多个按钮组成一行,比如说在范例6-5中就利用按钮分组的方法使4个按钮并列在一行中,如图6-24和图6-25所示. 图6-24 实现按钮分组的方法 图6-25 分组的按钮 而在上一节中也许有读者已经注意到,头部栏中的按钮并没有占据一整行,也没有与多个按钮一起成组存在,那么在页面的其他部分是否也可以让按钮以这样的形式出现呢? [范例6-9 简单的QWER键盘] 01 <!DOCTYPE

Android 实现用户列表信息滑动删除功能和选择删除功能

在项目开发过程中,常常需要对用户列表的信息进行删除的操作.Android中常用的删除操作方式有两种 ,一种就是类似微信的滑动出现删除按钮方式,还有一种是通过CheckBox进行选择,然后通过按钮进行删除的方式.本来的实例集成上述的两种操作方式来实现用户列表删除的效果. 设计思路:在适配器类MyAdapter一个滑动删除按钮显示或隐藏的Map,一个用于CheckBox是否选中的Map和一个与MainAcitivyt进行数据交互的接口ContentsDeleteListener,同时该接口包含两个方

RecyclerView借助ItemTouchHelper实现拖动和滑动删除功能

RecyclerView是官方推荐代替ListView的空间,怎样实现RecyclerView列表元素的拖动呢? 官方提供了ItemTouchHelper类使用过程例如以下: 定义ItemTouchHelper.Callback实现类,下面是几个重要的方法 package com.zms.copyapp.helper; import android.support.v7.widget.RecyclerView; import android.support.v7.widget.helper.It

android 继承ListView实现滑动删除功能.

在一些用户体验较好的应用上,可以经常遇见   在ListView中  向左或向右滑动便可删除那一项列表. 具体实现  则是继承ListView实现特定功能即可. (1). 新建 delete_button.xml文件 <?xml version="1.0" encoding="utf-8"?> <Button xmlns:android="http://schemas.android.com/apk/res/android" a

jQuery mobile 滑动打开面板

一.首先在<head></head>里面引入jQuery库.jQuery mobile库以及jQuery mobile样式 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" /> <script type="text/javascript" src="http

自定义listView添加滑动删除功能

今天研究了一下android里面的手势,结合昨天学习的自定义View,做了一个自定义的listview,继承自listView,添加了条目的滑动手势操作,滑动后出现一个删除按钮,点击删除按钮,触发一个删除的事件,在事件中进行删除当选行的元素,刷新listview. 一共分为以下几步进行: 1.新建一个按钮的布局文件,用来作为动态添加的按钮:layout_button.xml <?xml version="1.0" encoding="utf-8"?> &

整合了刷新、加载更多、滑动删除功能的XListview

转载请说明出处:http://blog.csdn.net/bz419927089 如果想做带有刷新.加载更多功能的listview,我们可以使用XListview.(已经停止维护,github地址:https://github.com/Maxwin-z/XListView-Android) 如果想做带有滑动删除功能的listview,我们可以使用SwipeListview.(github地址:https://github.com/47deg/android-swipelistview) 如果想做

实现listview滑动删除功能_Android源码

实现listview滑动删除功能,动作流畅. 下载地址:http://www.devstore.cn/code/info/579.html