<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
  <title>动态创建VML</title>
</head>
<STYLE>
 v\:* { BEHAVIOR: url(#default#VML) }
</STYLE>
<script language="JavaScript">
var clickX1 = -1;
var clickY1 = -1;
var clickX2 = -1;
var clickY2 = -1;
var theLastLine=null;
document.onclick=function (){
if(clickX1<0){
clickX1=event.x;
clickY1=event.y;
}
else{
createLine(clickX1,clickY1,event.x,event.y);
theLastLine=null;
clickX1=event.x;
clickY1=event.y;
}
}
document.ondblclick=function(){
document.body.click();
clickX1=-1;
clickY1=-1;
theLastLine=null;
return;
}
function createLine(x1,y1,x2,y2)
{
var strElement='<v:line from="'+x1+','+y1+'" to="'+x2+','+y2+'"></v:line>';
//alert(strElement);
var newline = document.createElement(strElement);
group1.insertBefore(newline);
theLastLine=newline;
}
document.onmousemove = function ()
{
if(clickX1 != -1){
if(theLastLine==null)
createLine(clickX1,clickY1,event.x,event.y);
else
theLastLine.to=event.x+","+event.y;
}
}
</script>
<body style="cursor:crosshair" oncontextmenu="event.returnValue=false;">
<v:group ID="group1" style="WIDTH:200px;HEIGHT:200px;" coordsize = "200,200"></v:group>
</body>
</html>