後置 、前置插入
第一個包裹是分别包裹，第二個是全都包裹到一個裡面
開頭的簡寫方式
點選a就會冒泡
true為事件捕獲
命名空間可以解綁分支事件
AJAX 前後端的橋梁
傳統AJAX
zepto中的Ajax
一般傳回json 簡化後
移動端使用touch
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="maximum-scale=1,initial-scale=1,user-scalable=0">
<title>zepto!>>touch</title>
</head>
<body>
<div id="touch-test" style="font-size:36px;width:200px;height:200px;background:#cce">
touch events test
</div>
<script type="text/javascript" src="./lib/zepto.min.js"></script>
<script type="text/javascript" src="./lib/touch.js"></script>
<script>
$(document).ready(function(){
$('#touch-test').bind('touchmove',function(e){e.preventDefault()})
listen_to('#touch-test')
function listen_to(el){
$(el).tap(function(){
console.log(' |tap!')
})
.doubleTap(function(){
console.log(' |doubleTap!')
})
.swipe(function(){
console.log('swipe')
})
.swipeLeft(function(){
console.log('swipe')
})
.swipeRight(function(){
console.log('swipe')
})
.swipeUp(function(){
console.log('swipe')
})
.swipeDown(function(){
console.log('swipe')
})
.longTap(function(){
console.log('swipe')
})
.singleTap(function(){
console.log('swipe')
})
}
});
</script>
</body>
</html>
簡單插件的使用
不填參數就是預設值的寫法
函數末尾加入return this 就可以鍊式調用了
多組插件
可以講上面的函數封裝到一個檔案當中然後就可以直接倒入插件了