canvas实例：签名

canvas签名

<canvas id="test" width="500" height="500"></canvas>
		<script type="text/javascript">
			window.onload=function(){
				var testNode = document.getElementById("test")
				if(testNode.getContext){
					var ctx = testNode.getContext("2d")
				}
				testNode.onmousedown=function(ev){
					 ev = ev || window.ev  //有些浏览器的event对象是在回调函数的参数上的，有些浏览器是在window上的（window.可省略）
					 if(testNode.setCapture){//全局捕获，
						 testNode.setCapture()
					 }
					 ctx.beginPath()
					 ctx.moveTo(ev.clientX-testNode.offsetLeft,ev.clientY-testNode.offsetTop)  //clientWitdh是视口宽度，减去testNode的width，拿到描绘的点相对于testNode的width
					 
					 document.onmousemove=function(ev){
						 ev = ev || window.ev
						 ctx.lineTo(ev.clientX-testNode.offsetLeft,ev.clientY-testNode.offsetTop)  //clientWitdh是视口宽度，减去testNode的width，拿到描绘的点相对于testNode的width
						 ctx.stroke()
						
					}
					document.onmouseup=function(){
						document.onmousemove=document.onmouseup=null
						if(document.releaseCapture){
							document.releaseCapture()
						}
					}
					return false
				}
			}
		</script>