请问HTML中如何任意拖动标签？

要想实现在浏览器中精确定位？不用层用什么？就算你不用div也的用Layer标签，用脚本判断鼠标拖动过程中的偏移量，然后设置层中数据的定位坐标，搞定。

解决方案 »

  1.   

    我的目的很简单，
    <table >
      <tr>
        <td><a href='#'>[字段名]</a></td>
      </tr>
    </table><td></td>的内容，是由鼠标从其他地方拖进来的。
    必须要实现精确定位，否则我无法把数据库中相应数据放到指定位置。
      

  2.   

    <a href="#" style='position:absolute;background:red' onmousedown=MouseDown(this) onmousemove=MouseMove() onmouseup=MouseUp()>dragme</a>
    <script language=javascript>
    var Obj;
    function MouseDown(obj)
    {
      Obj=obj;
      Obj.setCapture();
      Obj.l=event.x-Obj.style.pixelLeft;
      Obj.t=event.y-Obj.style.pixelTop;
    }
    function MouseMove()
    {
      if(Obj!=null)
      {
        Obj.style.left = event.x-Obj.l;
        Obj.style.top = event.y-Obj.t;
      }
    }
    function MouseUp()
    {
      if(Obj!=null)
      {
        Obj.releaseCapture();
        Obj=null;
      }
    }
    </script>
      

  3.   

    楼上的朋友，谢谢你，不过似乎没能作到这个效果。
    我最终目的是生成的HTML为
    <table>
      <tr>
        <td><a >dragme</a> </td>
      </tr>
    </table>
    您的代码实现的是平滑拖动。其实，效果就象在　Dreamweaver中往<table>内增加<input>一样。
      

  4.   

    功能勉强实现，我是用嵌套Iframe作的。
    例子如下
    bbb.htm
    <html> 
    <script language="javascript"> function fn_LoadCode()
     {
        window.alert(Editor.document.body.innerHTML);    
     }</script><body  >
     <iframe id="Editor" src="aaa.htm"></iframe>
     <input type ="button" onclick="javascript:fn_LoadCode()" value ="OK">
    </body>
    </html><script language="javascript">
    function document.onreadystatechange()             //该事件似乎在刚开始时执行，以后不执行
    {
       Editor.document.designMode="On" 
         setTimeout("Editor.focus();",0);
    }
    </script>
    aaa.htm
    <html>
    <body ><a href="javascript:window.alert('ok')">adgasdgasd</a>  <table border="1">
         <tr>
           <td>aa</td>
           <td>bb</td>
         </tr>
      </table>  
    </body>
    </html>
     
    这样可以实现我需要的效果，但outerHTML代码，被系统整合得非常凌乱，终究是个遗憾。
    还有，拖动时要用鼠标选蓝一行字，才可以拖，眼下还没好的思路解决。