如何实现：在页面上按住鼠标左键，拖动一矩形面积，当放开鼠标时弹出该矩形的坐标<left,top,width,heigh>？

<script>
var startX = 0 ;
var startY = 0 ;
var endX = 0;
var endY = 0 ;
function aa(){
startX = event.x ;
startY = event.y;
}
function bb(){
endX = event.x ;
endY = event.y ;
var s0 = "" ;
s0 +="left_top(" ;
s0 +=(startX>endX)?endX:startX;
s0 +=","
s0 +=(startY>endY)?endY:startY;
s0 +="),right_bottom(";
s0 +=(startX>endX)?startX:endX;
s0 +=","
s0 +=(startY>endY)?startY:endY;
s0 +="),width=";
s0 +=((startX>endX)?(startX-endX):(endX-startX));
s0 +=",";
s0 +=",height=" ;
s0 +=((startY>endY)?(startY-endY):(endY-startY));
alert(s0);
}
</script>
<body onmousedown=aa() onmouseup=bb()>

解决方案 »

  1.   

    <BODY onmousedown="sx=event.clientX;sy=event.clientY" onmouseup="ex=event.clientX;ey=event.clientY;alert(sx+':'+sy);alert(ex+':'+ey);">
    </BODY>
      

  2.   

    老兄你运气真好，我刚做完一个<script language="Jscript">
    var drawing=false;
    var oldx=0;
    var oldy=0;
    function window.onload(){
    var el=document.body
    el.attachEvent("onmousedown",function(){
    drawing=true;
    oldx=event.x+document.body.scrollLeft;
    oldy=event.y+document.body.scrollTop;
    el.setCapture();
    });
    el.attachEvent("onmouseup",function(){
    if (!drawing) return;
    el.releaseCapture()
    drawing=false;
    with(document.all.NewDiv.style) {
    if (pixelWidth>10 && pixelHeight>10){
    alert([pixelLeft,pixelTop,pixelWidth,pixelHeight])
    }
    }
    });
    el.attachEvent("onmousemove",function(){
    if (!drawing) return;
    document.all.NewDiv.style.left=(oldx>event.x+document.body.scrollLeft)?event.x+document.body.scrollLeft:oldx;
    document.all.NewDiv.style.top=(oldy>event.y+document.body.scrollTop)?event.y+document.body.scrollTop:oldy;
    document.all.NewDiv.style.width=Math.abs(document.body.scrollLeft+event.x-oldx)
    document.all.NewDiv.style.height=Math.abs(document.body.scrollTop+event.y-oldy)  
    document.all.NewDiv.style.display="block"
    });
    }
    </script>
    <body onSelectstart="return false;" onDragstart="return false;">
    <div id=NewDiv style="display:none;position:absolute;top:1px;left:1px;border:2px red solid;width:1px;height:1px"></div>
    </body>