VS2003 实现站点 在线签名 功能 (示例代码下载)

var clicked = false; var Results; var Canvas; var isIE; var pos = new Array(); var CanvasX; var CanvasY; var opswitch; var proClientX; var proClientY; var strCoords='' var txtCoordsClientId function load( coordsClientId ) { txtCoordsClientId = coordsClientId; isIE = (document.all != undefined); var panel = document.getElementById("Panel"); Canvas = document.getElementById("Canvas"); if(!isIE) { Canvas.addEventListener("mousemove",handleMovement,false); Canvas.addEventListener("mousedown",clickOn,false); document.addEventListener("mouseup",clickOff,false); } else { Canvas.onmousemove = handleMovement; Canvas.onmousedown = clickOn; document.onmouseup = clickOff; } getPos( Canvas ); CanvasX = pos[0]; CanvasY = pos[1]; //alert(CanvasX + "" + CanvasY) } function handleMovement(evt) { var e = (isIE ? window.event : evt); var target = (isIE ? e.srcElement : e.target); var x = 0; var y = 0; if(clicked && target.id == "Canvas") { if( opswitch ) { opswitch = false; proClientX = e.clientX; proClientY = e.clientY; } else { if( Math.abs(e.clientX - proClientX) < 2 && Math.abs(e.clientY - proClientY ) <2 ) { mkDiv(proClientX , proClientY , 1, 1 ) } else { mkLin(proClientX, proClientY, e.clientX, e.clientY ) } proClientX = e.clientX; proClientY = e.clientY; } } } function setClick(isClicked) { clicked = isClicked; opswitch = isClicked; } function clickOn(e) { setClick(true); } function clickOff(e) { setClick(false); } function clearSignature() { Canvas.innerHTML = ''; document.getElementById( txtCoordsClientId ).value = ''; strCoords = ''; } function captureSignature() { document.getElementById( txtCoordsClientId ).value = strCoords; strCoords = ''; } function getPos(obj) { var t=obj.offsetTop; var l=obj.offsetLeft; while( obj=obj.offsetParent ) { t+=obj.offsetTop; l+=obj.offsetLeft; } pos[0] = l; pos[1] = t; } function mkLin(x1, y1, x2, y2) { if (x1 > x2) { var _x2 = x2; var _y2 = y2; x2 = x1; y2 = y1; x1 = _x2; y1 = _y2; } var dx = x2-x1, dy = Math.abs(y2-y1), x = x1, y = y1, yIncr = (y1 > y2)? -1 : 1; if (dx >= dy) { var pr = dy<<1, pru = pr - (dx<<1), p = pr-dx, ox = x; while ((dx--) > 0) { ++x; if (p > 0) { mkDiv(ox, y, x-ox, 1); y += yIncr; p += pru; ox = x; } else p += pr; } mkDiv(ox, y, x2-ox+1, 1); } else { var pr = dx<<1, pru = pr - (dy<<1), p = pr-dy, oy = y; if (y2 <= y1) { while ((dy--) > 0) { if (p > 0) { this.mkDiv(x++, y, 1, oy-y+1); y += yIncr; p += pru; oy = y; } else { y += yIncr; p += pr; } } mkDiv(x2, y2, 1, oy-y2+1); } else { while ((dy--) > 0) { y += yIncr; if (p > 0) { this.mkDiv(x++, oy, 1, y-oy); p += pru; oy = y; } else p += pr; } mkDiv(x2, oy, 1, y2-oy+1); } } } function mkDiv(x, y, w, h ) { var div = document.createElement("div"); div.className = "point"; div.style.left = x; div.style.top = y; div.style.width = w; div.style.height = h; div.style.clip = 'rect(+0px,+'+ w +'px,+'+h+'px,+0px)'; var absX = x - CanvasX; var absY = y - CanvasY; if(isIE) { div.attr = absX + "~" + absY + "~" + w + "~" + h ; } else { div.innerText = absX + "~" + absY + "~" + w + "~" + h ; } strCoords = strCoords + absX + "~" + absY + "~" + w + "~" + h + ":"; Canvas.appendChild( div ); }