获取已删除元素的 'top' 位置 属性 时出错

Question

我正在处理一个项目，我必须在其中拖放元素并对这些元素执行一些进一步的操作。目前我正在尝试获取元素放在容器上的位置，但在调试器中出现以下错误。

错误

trail.js:262 Uncaught TypeError: Cannot read property 'top' of undefined

上下文中的方法

function saveFlowchart(){
    var nodes = [];

    //////////////////////////////////////////////////////////////////
    //Code in Context to the question//

    var matches = [];
    var searchEles = document.getElementById("container").children;
    for(var i = 0; i < searchEles.length; i++) 
    {
        matches.push(searchEles[i]);
        alert("elements: "+ searchEles[i].id);
        var idOfEl = searchEles[i].id;

        var $element = $(idOfEl);
        var position = $element.position();
        position.bottom = position.top + $element.height();
        position.right = position.left + $element.width();
        alert("Top position: " + position.top + "\nLeft position: " + position.left + "\nBottom position: " + position.bottom + "\nRight position: " + position.right);
    }    
    /////////////////////////////////////////////////////

    $(".node").each(function (idx, elem) {
        var $elem = $(elem);
        var endpoints = jsPlumb.getEndpoints($elem.attr('id'));
        console.log('endpoints of '+$elem.attr('id'));
        console.log(endpoints);
        nodes.push({
            blockId: $elem.attr('id'),
            nodetype: $elem.attr('data-nodetype'),
            positionX: parseInt($elem.css("left"), 10),
            positionY: parseInt($elem.css("top"), 10)
        });
    });
    var connections = [];
    $.each(jsPlumb.getConnections(), function (idx, connection) {
        connections.push({
            connectionId: connection.id,
            pageSourceId: connection.sourceId,
            pageTargetId: connection.targetId
        });
    });

    var flowChart = {};
    flowChart.nodes = nodes;
    flowChart.connections = connections;
    flowChart.numberOfElements = numberOfElements;

    var flowChartJson = JSON.stringify(flowChart);
    //console.log(flowChartJson);

    $('#jsonOutput').val(flowChartJson);
}

此方法保存连接并以 json 格式输出。但我也需要重新生成定制元素。这就是为什么我试图到达那里并重新生成它们以便我可以重新创建创建的流程图。

在这方面的任何帮助将不胜感激。

Answer 1

以下内容可能有帮助

上一行代码

var $element = $(idOfEl);

更改为

 var $element = $("#" + searchEles[i].id);