jquery实现app开发闹钟功能_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实现app开发闹钟功能_jQuery Mobile 实现苹果滑动删除闹钟功能的几点总结的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: SOFAServerless 体系助力业
- 下一篇: css动画效果制作正方体旋转相册