Javascript jQueryUI:元素丢失了它的"；“可拖动性”；_Javascript_Jquery_Jquery Ui

Javascript jQueryUI:元素丢失了它的"；“可拖动性”；

javascript jquery jquery-ui

Javascript jQueryUI:元素丢失了它的"；“可拖动性”；,javascript,jquery,jquery-ui,Javascript,Jquery,Jquery Ui,我正在开发一种基于web的地图编辑器，并使用JQuery和jQueryUI。我使用后者主要是为了使对象可以拖动。当用户单击按钮时，对象将以默认位置创建并插入页面中。当创建对象时，我使其可拖动如果我创建两个或多个重叠的对象，我只能拖动顶部的对象，其他对象将失去拖动能力。如果我添加这些对象并将它们移动到某个地方，在使它们重叠之后，就没有问题了，我仍然可以将它们拖动到我想要的地方。只有在创建对象时对象重叠时才会出现问题这是我写的代码 <html> <head>

我正在开发一种基于web的地图编辑器，并使用JQuery和jQueryUI。我使用后者主要是为了使对象可以拖动。当用户单击按钮时，对象将以默认位置创建并插入页面中。当创建对象时，我使其可拖动

如果我创建两个或多个重叠的对象，我只能拖动顶部的对象，其他对象将失去拖动能力。如果我添加这些对象并将它们移动到某个地方，在使它们重叠之后，就没有问题了，我仍然可以将它们拖动到我想要的地方。只有在创建对象时对象重叠时才会出现问题

这是我写的代码

<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>


var lastNodeId；
$（函数（）{
lastNodeId=0；
$（“#节点按钮”）。单击（添加节点）；
});
函数addNode（）{
var id=“node”+lastNodeId；
$（“#绘图区域”）。追加（“”）；
var jg=新的图形（id）；
jg.setColor（“000000”）；
drawImage（“pc_icon.png”，50,50,50,50）；
jg.paint（）；
var idImg=“img”+lastNodeId；
$（“#”+id+“img”）.attr（“id”，idImg）；
lastNodeId++；
$（“#”+idImg）.draggable（）；
}
阿吉恩吉诺多

我使用JSGraphics只是在页面上绘制一个图标，可以在中找到它。我真的希望有人能帮助我了解发生了什么，我做错了什么！：）

更新

我已尝试在其他位置添加下一个对象。我发现，如果到上一个添加的对象的距离至少为17px，则底部的对象不会失去拖动能力。

无论我修改x或y参数，它都必须至少距离17px。

尝试替换以下代码：

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

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

对于这一个：

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

因为它可能是新的

id

set没有为dom更新得如此之快，以至于jQuery抓住了它

更新：
如果您这样做：

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

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

我刚刚尝试了您的建议，但没有成功：（这是有道理的，但我甚至尝试在单击按钮和再次单击按钮之间等待几秒钟，但底部的元素仍然无法拖动：（我更新了我的答案，做了一些你可以做的进一步调试。）你能给出你正在使用的jqGraphics库的url吗？我试过了，在控制台上它总是写着“im len:1”。我更新了我的问题，你认为图形库会引起一些麻烦吗？