在移动开发中，一种较为容易的做法是，先在桌面上开始原型设计，然后再在打算要支持的设备上处理移动特有的部分。多点触摸正是难以在PC上进行测试的那些功能之一，因为大部分的PC都没有触摸输入。
不得不在移动设备上进行的测试有可能会拉长你的开发周期，因为你所做的每项改变都需要提交代码到服务器上，接着再加载到设备上。然后，一旦运行后，对应用也就没有太多的调试了，因为平板电脑和智能手机都很缺乏web开发者所用的工具。
这个问题的一个解决方案是在开发机器上模拟触发事件。对于单点触摸，触摸事件可以基于鼠标事件来模拟。如果你有触摸输入设备的话，比如说现代的App MacBook，那么多点触摸也可以被模拟。
单点触摸事件
如果你想在桌面上模拟单点触摸事件的话，试一下Phantom Limb，该程序在网页上模拟触摸事件并提供一只巨手来引导。
另外还有Touchable这一jQuery插件，该插件跨平台地统一了触摸和鼠标事件
多点触摸事件
为了能够让你的多点触摸web应用在你的浏览器或是多点触摸控板（比如说Apple MacBook或是MagicPad）上起作用，我创建了这一个MagicTouch.js填充工具，其捕捉来自触控板的触摸事件，然后把它们转换成标准兼容的触摸事件。
1. 下载npTuioClient NPAPI插件并把它安装到~/Library/Internet Plug-Ins/目录下。
2. 下载这一Mac MagicPad的TongSeng TUIO应用并启动这一服务器。
3. 下载MagicTouch.js这一javascript库来基于npTuioClient回调模拟规范兼容的触摸事件。
4. 以如下方式把magictouch.js脚本和npTuioClient插件包含到你的应用中：
< head>
...
< script src="https://www.jb51.net/path/to/magictouch.js" kesrc="https://www.jb51.net/path/to/magictouch.js">< /script>
< /head>
< body>
...
< object type="application/x-tuio">
Touch input plugin failed to load!
< /object>
< /body>
我只在Chrome 10上测试了这一方法，不过只要稍做调整它应该能够在其他的现代浏览器上工作。
如果你的计算机没有多点触摸输入的话，你可以使用其他的TUIO跟踪器，比如说reacTIVision来模拟触摸事件。欲了解更多信息，请参阅TUIO项目页面。
需要注意的一点是，你的手势可以是和OS层面的多点触摸手势相同的。在OS X上，你可以通过进入System Preferences中的Trackpad偏好设定版面来配置系统范围的事件。
随着多点触摸功能逐渐得到跨移动浏览器的的广泛支持，我非常高兴地看到新的web应用充分利用了这一丰富的API。
原文来源：html5rocks.com
原文标题：Developing for Multi-Touch Web Browsers
一、手机上的触摸事件
基本事件：
touchstart //手指刚接触屏幕时触发
touchmove //手指在屏幕上移动时触发
touchend //手指从屏幕上移开时触发
下面这个比较少用：touchcancel //触摸过程被系统取消时触发
每个事件都有以下列表，比如touchend的targetTouches当然是 0 咯：
touches //位于屏幕上的所有手指的列表
targetTouches //位于该元素上的所有手指的列表
changedTouches //涉及当前事件的所有手指的列表
每个事件有列表，每个列表还有以下属性：
其中坐标常用pageX,pageY：
pageX //相对于页面的 X 坐标
pageY //相对于页面的 Y 坐标
clientX //相对于视区的 X 坐标
clientY //相对于视区的 Y 坐标
screenX //相对于屏幕的 X 坐标
screenY //相对于屏幕的 Y 坐标
identifier // 当前触摸点的惟一编号
target //手指所触摸的 DOM 元素
其他相关事件：
event.preventDefault（） //阻止触摸时浏览器的缩放、滚动条滚动
var supportTouch = "createTouch" in document //判断是否支持触摸事件
二、示例
以下是获取不同类型滑动的代码具体做法，结合前人的思想，封装好了，可以借鉴学习：
var touchFunc = function(obj,type,func) { //滑动范围在5x5内则做点击处理，s是开始，e是结束 var init = {x:5,y:5,sx:0,sy:0,ex:0,ey:0}; var sTime = 0, eTime = 0; type = type.toLowerCase(); obj.addEventListener("touchstart",function(){ sTime = new Date().getTime(); init.sx = event.targetTouches[0].pageX; init.sy = event.targetTouches[0].pageY; init.ex = init.sx; init.ey = init.sy; if(type.indexOf("start") != -1) func(); }, false); obj.addEventListener("touchmove",function() { event.preventDefault();//阻止触摸时浏览器的缩放、滚动条滚动 init.ex = event.targetTouches[0].pageX; init.ey = event.targetTouches[0].pageY; if(type.indexOf("move")!=-1) func(); }, false); obj.addEventListener("touchend",function() { var changeX = init.sx - init.ex; var changeY = init.sy - init.ey; if(Math.abs(changeX)>Math.abs(changeY)&&Math.abs(changeY)>init.y) { //左右事件 if(changeX > 0) { if(type.indexOf("left")!=-1) func(); }else{ if(type.indexOf("right")!=-1) func(); } } else if(Math.abs(changeY)>Math.abs(changeX)&&Math.abs(changeX)>init.x){ //上下事件 if(changeY > 0) { if(type.indexOf("top")!=-1) func(); }else{ if(type.indexOf("down")!=-1) func(); } } else if(Math.abs(changeX)<init.x && Math.abs(changeY)<init.y){ eTime = new Date().getTime(); //点击事件，此处根据时间差细分下 if((eTime - sTime) > 300) { if(type.indexOf("long")!=-1) func(); //长按 } else { if(type.indexOf("click")!=-1) func(); //当点击处理 } } if(type.indexOf("end")!=-1) func(); }, false); };
转载的文章：手机触摸屏的JS事件
处理Touch事件能让你跟踪用户的每一根手指的位置。你可以绑定以下四种Touch事件：