学一点写一点。实现的方法有很多,这算其一吧。 <html> <head> <title></title> <mce:script language="javascript" type="text/javascript"><!-- function showpos() { document.all.x.value = event.clientX; document.all.y.value = event.clientY; } function Point() { this.x, this.y; this.eventpos = function() { this.x = event.clientX; this.y = event.clientY; } this.setpos = function(pt) { this.x = pt.x; this.y = pt.y; } } var ptPre = new Point(); var ptCur = new Point(); function move(ptTo, ptFrom) { ox = ptTo.x - ptFrom.x; oy = ptTo.y - ptFrom.y; event.srcElement.style.posLeft += ox; event.srcElement.style.posTop += oy; } // --></mce:script> <mce:style type="text/css"><!-- .dr { position : relative ; cursor : hand ; event:expression( οndragstart=function() { ptCur.eventpos(); ptPre.eventpos(); }, οndrag=function(){ ptCur.eventpos(); move(ptCur,ptPre); ptPre.setpos(ptCur); } ) } --></mce:style><style type="text/css" mce_bogus="1">.dr { position : relative ; cursor : hand ; event:expression( οndragstart=function() { ptCur.eventpos(); ptPre.eventpos(); }, οndrag=function(){ ptCur.eventpos(); move(ptCur,ptPre); ptPre.setpos(ptCur); } ) }</style> </head> <body οnmοusemοve="showpos()" > <form> <div class="dr">X:<input name="x" id="x" type="text"></input></div> <div class="dr">Y:<input name="y" id="y" type="text"></input></div> </form> <img class="dr" src="free_register.gif" mce_src="free_register.gif" /> <br/> <div class="dr">Select me,and drag</div> </body> </html>