在网上搜索了一些JavaScript画线的代码，综合了几个例子，作了一些修改和整合，实现了画线的功能，但是只是很简单的功能，只能实现单击画线，双击结束，由于本人初学JS，还不知道怎么实现撤消，及清除。页面代码如下：
<html xmlns:v="http://www.eglic.com/"><head><title>页面画线</title><meta name="ContentType" content="text/html" /><meta name="CharSet" content="GB2312" /><script language="javascript">var Working=false;var points = [];
var lastPoint = {x:0,y:0};
var line = null;document.ondblclick=function (){
if(!Working) return;points = [];
lastPoint = {x:0,y:0}
lastPoint Working=false;
}document.onclick=function (){if(!Working){Working=true;
}var s='<v:line from="'+event.x+','+event.y+'" to="'+event.x+','+event.y+'" style="position:absolute;left:0px;top:0px;"></v:line>';lastPoint.x = event.x;lastPoint.y = event.y;points.push( {x:event.x,y:event.y} );document.getElementById("show").innerHTML = "X:"+ event.x + " Y:" + event.y;document.getElementById("show").style.display="";var o=document.createElement(s);document.body.insertAdjacentElement('BeforeEnd',o);line = o;}document.onmousemove=function (){if(!Working) return;line.to = event.x + "," + event.y;document.getElementById("dshow").innerHTML = "X:"+ event.x + " Y:" + event.y;document.getElementById("dshow").style.display="";}</script><style type="text/css">v\:* {behavior:url(#default#VML);}</style></head><body> <div id="show" style="border:5px solid #000;200px;height:30px;line-height:30px;text-align:center;display:none"> </div><div id="dshow" style="border:5px solid #000;200px;height:30px;line-height:30px;text-align:center;display:none"> </div></body></html>