从Javascript中的json输出获取每个元素的数据

时间:2016-09-09 06:28:27

标签: javascript jquery json each extract

我试图让每个元素数据以Json输出格式存储。我目前尝试了以下

加载单个Json数据

function saveFlowchart(){
    var node = [];
    var matches = [];
    var totalElementCount=0;
    var searchEles = document.getElementById("container").children;
    for(var i = 0; i < searchEles.length; i++)
    {
        matches.push(searchEles[i]);
        var idOfEl = searchEles[i].id;
        totalElementCount=idOfEl;

        if(searchEles[i].id !=null || searchEles[i].id !="")
        {
            var $element = $("#" + searchEles[i].id);
            var dropElem = $("#" + searchEles[i].id).attr('class');

            var position = $element.position();

            var elId = parseInt(idOfEl);

            if (dropElem=="streamdrop ui-draggable")
            {
                position.bottom = position.top + $element.height();
                position.right = position.left + $element.width();

                node.push({
                    id: idOfEl,
                    class: dropElem,
                    position:
                    {
                        top: position.top,
                        left: position.left,
                        bottom: position.bottom,
                        right: position.right
                    }
                });

                for (var count = 0; count < 100; count++)
                {
                    if (createdImportStreamArray[count][0] == idOfEl)
                    {
                        node.push({
                            predefinedStream: createdImportStreamArray[count][1],

                     //...Continued

 var flowChart = {};
 flowChart.elements =node;
 var flowChartJson = JSON.stringify(flowChart);
 $('#jsonOutput').val(flowChartJson);
}

创建Json输出的方法

loadFlowChart()

界面如下图所示。单击 Load 按钮时,根据第一段代码中显示的<uses-permission android:name="android.permission.READ_PHONE_STATE"></uses-permission> 方法,需要提醒每个元素,类和顶部位置。< / p>

Json output

但是我收到了一个错误,这个错误甚至不是我编写的任何脚本,而是jquery帮助程序脚本。

  

错误:未捕获的TypeError:无法读取属性&#39; length&#39;未定义的

Error

我想知道在尝试循环Json输出节点时我做错了什么,并且在这方面的任何帮助都将受到高度赞赏。

1 个答案:

答案 0 :(得分:0)

根据你的评论,这部分内容是正确的,但当人们读到它时,它似乎并不是。

在以下功能中:

function loadFlowchart() {
    // Here you get the contents of the input field as text 
    var flowChartJson = $('#jsonOutput').val();
    // Here you parse it into a Javascript object
    var objFromJson = JSON.parse(flowChartJson);
    // Here you access the "node" attribute of that object, but if I look to the screenshot 
    // you provided there is no "node" attribute in the input field. If that's the case, 
    // then "node" is "undefined" and it would produce the error you indicate.
    var node = objFromJson.node;
    // you can verify by showing the full object on the console
    console.log(objFromJson);
    // The input field, as seen on the screenshot, would suggest you need to access the
    // "elements" attribute instead of "node".
    var node = objFromJson.elements;
    $.each(node, function (index, element) {
        var id = element.id;
        var classes = element.class;
        var positionTop = element.position.top
        alert("Id of element parsed: " + id + "\nclass: " + classes 
        + "\npositionTop: " + positionTop);
    });
}