JQuery-ui：元素失去“可拖动性”

我正在开发一种基于web的地图编辑器，我正在使用JQuery和jQuery-ui。我主要使用后者来使对象可拖动。当用户点击一个按钮时，会在默认位置创建并插入对象。当对象被创建时，我使它可拖动。JQuery-ui：元素失去“可拖动性”

会发生什么事情是，如果我创建了2个或更多的重叠对象，我只能拖动顶部的那个，其他的则会丢失它们的可拖动性。如果我添加这些对象，并将它们移动到某个地方，然后让它们重叠，则不存在任何问题，我仍然可以将它们拖到我想要的位置。只有当对象重叠时才会出现问题。

这是我写的代码。

<html> 
    <head> 
<script type="text/javascript" src="wz_jsgraphics.js"></script> 
<script type="text/javascript" src="jquery-1.8.2.js"></script> 
<script type="text/javascript" src="jquery-ui-1.8.24.custom.min.js"></script> 

<script type="text/javascript"> 
    var lastNodeId; 

    $(function() { 
     lastNodeId = 0; 
     $("#nodeButton").click(addNode); 
    }); 


    function addNode() { 
     var id = "node" + lastNodeId; 

     $("#drawArea").append("<div id=\"" + id + "\" class='node'></div>"); 

     var jg = new jsGraphics(id); 
     jg.setColor("#000000"); 
     jg.drawImage("pc_icon.png", 50, 50, 50, 50); 
     jg.paint(); 

     var idImg = "img" + lastNodeId; 
     $("#" + id + " img").attr("id", idImg); 

     lastNodeId++; 
     $("#" + idImg).draggable(); 

} 

</script> 
</head> 

<body> 
    <button type="button" id="nodeButton">Aggiungi Nodo</button> 
    <div id="drawArea"> </div> 
</body> 
</html>

我用JSGraphics只是在页面上画一个图标，它可以在http://www.walterzorn.de/en/jsgraphics/jsgraphics_e.htm找到。我真的很希望有人能帮助我理解发生了什么事以及我做错了什么！ :)

更新

我试图添加的下一个对象在不同的地方。我发现如果与前一个添加对象的距离至少为17px，那么底部不会失去可拖动性。不管我是否修改x或y参数，它至少只有17px。

来源

2012-10-25 giocarmine

尝试更换你的下面的代码：

$("#" + id + " img").attr("id", idImg); 

lastNodeId++; 
$("#" + idImg).draggable();

这一个：

$("#" + id + " img").attr("id", idImg).draggable(); 
lastNodeId++;

，因为它可能是新的id集不会更新DOM如此之快，jQuery的抓住它。

更新：
如果你：

lastNodeId++; 
console.log('im len: '+$("#" + idImg).length); 
$("#" + idImg).draggable();

什么呢控制台打印？它可能是图像尚未创建，请查看jqGraphics是否在创建图像时回调。

来源

2012-10-25 10:59:39 Nelson

我刚刚试过你的建议，但没有成功:( 这是有道理的，但我甚至试图等待几秒钟之间的一个点击按钮和另一个和底部的元素仍然不能被拖动:( – giocarmine

我更新了我的答案，进一步的调试，你可以做..也可以给你使用的jqGraphics库的URL？ – Nelson

我试过了，在控制台它总是写“im len：1 “ 我已经更新了我的问题，你认为图形库可能会导致一些麻烦？ – giocarmine

JQuery-ui：元素失去“可拖动性”

回答

相关问题