html5 移动终端页面的上下左右滑动问题

在写响应式的html5页面的时候，有时候需要禁止左右滑动，但是允许上下滑动
如果这样做监听
[js]
div.addEventListener(‘touchmove’,function(event){
event.preventDefault();//阻止浏览器的默认事件
})
[/js]
那么左右也不能滑动了
所以这样做
[js]
var xx,yy,XX,YY,swipeX,swipeY ;
div.addEventListener(‘touchstart’,function(event){
xx = event.targetTouches[0].screenX ;
yy = event.targetTouches[0].screenY ;
swipeX = true;
swipeY = true ;
})
div.addEventListener(‘touchmove’,function(event){
XX = event.targetTouches[0].screenX ;
YY = event.targetTouches[0].screenY ;
if(swipeX && Math.abs(XX-xx)-Math.abs(YY-yy)>0) //左右滑动
{
event.stopPropagation();//组织冒泡
event.preventDefault();//阻止浏览器默认事件
swipeY = false ;
//左右滑动
}
else if(swipeY && Math.abs(XX-xx)-Math.abs(YY-yy)<0){ //上下滑动
swipeX = false ;
//上下滑动，使用浏览器默认的上下滑动
}
})
[/js]