2010-03-14 43 views
0

克隆拖事件中,我想创建一个新的“.B” DIV appendTo document.body的,如何使用jQuery和jQuery UI的

,它可以像dragable其父亲,

但我无法克隆的拖动事件,

如何做到这一点,

感谢

,这是我的代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
    <head> 
     <meta name="viewport" content="width=device-width, user-scalable=no"> 
    </head> 
<body> 
     <style type="text/css" media="screen"> 

     </style> 

     <div id="map_canvas" style="width: 500px; height: 300px;background:blue;"></div> 

     <div class=b style="width: 20px; height: 20px;background:red;position:absolute;left:700px;top:200px;"></div> 

     <script src="jquery-1.4.2.js" type="text/javascript"></script> 
     <script src="jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script> 
     <script type="text/javascript" charset="utf-8"> 
$(".b").draggable({ 
    start: function(event,ui) { 
     //console.log(ui) 
     //$(ui.helper).clone(true).appendTo($(document.body)) 
     $(this).clone(true).appendTo($(document.body))//draggable is not be cloned, 
     } 
    }); 
$("#map_canvas").droppable({ 
drop: function(event,ui) { 
    //console.log(ui.offset.left+' '+ui.offset.top) 
    ui.draggable.remove(); 
    } 
}); 
     </script> 
    </body> 
</html> 

回答

0

看起来你正在尝试做的是在回落后将其恢复到原来的位置。试试这样做:

$(".b").draggable({ 
    revert: true, 
    revertDuration: 0 
}); 
$("#map_canvas").droppable({ 
    drop: function(event,ui) { 
     //console.log(ui.offset.left+' '+ui.offset.top) 
    } 
}); 
+0

酷酷酷酷 – zjm1126 2010-03-14 03:46:15

0

深副本不会有克隆工作,请尝试使用jQuery住

$(".b").live("draggable", function() { 
//impl 
}); 

现场直播意味着创建的每个对象将如果选择匹配进行检查,并让事件增加。

+0

这将适用于“可拖动”自定义事件,但不适用于应用可拖动插件。 – PetersenDidIt 2010-03-14 03:58:09

+0

确实,认为这是一个事件。感谢输入 – 2010-03-14 14:53:07