javascript - 将 JSON 从文本字段解析为对象数组

Question

我在将一些 JSON 数据解析为原始对象数组时遇到了问题，下面是附加的内容 例如，我有这个原始数据(JavaScript):

var points = [];
points = [
    { lat: "38.713852", lng: "-9.145621", data: "<div align=left class=gMapsOverlay><span>Loja centro de Braga</span></div>", options: { icon: '../layout/icon_map_point.png' } },
    { lat: "39.825751", lng: "-7.479642", data: "<div align=left class=gMapsOverlay><span>Apartamento T3</span></div>", options: { icon: '../layout/icon_map_point.png' } },
    { lat: "38.730638", lng: "-9.139604", data: "<div align=left class=gMapsOverlay><span>Apartamento Duplex</span></div>", options: { icon: '../layout/icon_map_point.png' } }
];

我必须完全按照我试图解释的方式执行此操作，我需要将其发送到 ID="hdd_GmapPoints"的隐藏字段(在本例中)，我这样做:

private void SetMap () {
    string aux = "";
    string[] lat = new string[3];
    string[] lng = new string[3];
    string[] designacao = new string[3];

    lat[0] = "38.713852";
    lat[1] = "39.825751";
    lat[2] = "38.730638";

    lng[0] = "-9.145621";
    lng[1] = "-7.479642";
    lng[2] = "-9.139604";

    designacao[0] = "Loja centro de Braga";
    designacao[1] = "Apartamento T3";
    designacao[2] = "Apartamento Duplex";

    for(int i = 0; i < lat.Length; i++) {
        aux += "{ lat: \"" + lat[i].ToString().Replace(",", ".") + "\",  " +
               "lng: \"" + lng[i].ToString().Replace(",", ".") + "\", " +
               "data: \"<div align=left class=gmapsoverlay><span>" + designacao[i] + "</span></div>\", " +
               "options: { icon: '../layout/icon_map_point.png' } },";

        //aux[idx] = "{ lat: \"" + r["latitude"].ToString().Replace(",", ".") + "\",  " +
        //           "lng: \"" + r["longitude"].ToString().Replace(",", ".") + "\", " +
        //           "data: '<div align=left class=gMapsOverlay><span>" + r["designacao"] + "</span></div>', " +
        //           "options: { icon: '../layout/icon_map_point.png' } }";
    }

    if(aux != "") {
        //hdd_GmapPoints.Value = aux.ToString();
        //hdd_GmapPoints.Value = aux.Substring(0, aux.Length - 1);

        var jsonSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        string json = jsonSerializer.Serialize(aux.ToString().Substring(0, aux.ToString().Length - 1));
        hdd_GmapPoints.Value = json;

    }
}

然后我必须将其解析回 Javascript 对象数组，这是我的 javascript 代码:

function setMap() {

    var points = [];

    points = [
            { lat: "38.713852", lng: "-9.145621", data: "<div align=left class=gMapsOverlay><span>Loja centro de Braga</span></div>", options: { icon: '../layout/icon_map_point.png' } },
            { lat: "39.825751", lng: "-7.479642", data: "<div align=left class=gMapsOverlay><span>Apartamento T3</span></div>", options: { icon: '../layout/icon_map_point.png' } },
            { lat: "38.730638", lng: "-9.139604", data: "<div align=left class=gMapsOverlay><span>Apartamento Duplex</span></div>", options: { icon: '../layout/icon_map_point.png' } }
        ];

        //points = [str1.split('%')];


        var aux = $("#<%=hdd_GmapPoints.ClientID %>").val();
        var points2 = eval(aux);
        //var points2 = JSON.parse(aux);

        console.log("TYPE 1: " + $.type(points));
        console.log("CONTENT 1:" + points);
        console.log("TYPE 2: " + $.type(points2));
        console.log("CONTENT 2:" + points2);
        console.table(points);
}

但它不起作用，因为它向我显示了假设对象作为字符串，这是我从 console.log(points2); 得到的

"{ lat: "38.713852", lng: "-9.145621", data: "Loja centro de Braga", options: { icon: '../layout/icon_map_point.png' } },{ lat: "39.825751", lng: "-7.479642", data: "Apartamento T3", options: { icon: '../layout/icon_map_point.png' } },{ lat: "38.730638", lng: "-9.139604", data: "Apartamento Duplex", options: { icon: '../layout/icon_map_point.png' } }"

我需要这个来提供

console.table(points);

给出

我再次需要通过隐藏字段将其从 C# 发送到 JQuery，代码必须通过该隐藏字段。

有人知道吗？

Answer 1

好吧，很抱歉占用大家时间，但我找到了解决方案，因为我不太擅长 C#，我没想到它会起作用，但它起作用了。

我所做的实际上是在代码后面创建对象，这样我就可以使用 JSON 将整个对象从 C# 完全传递到 javascript。

//declared this 2 classes at the top
class Options {
    public string icon {
        get;
        set;
    }
}

class Aux {
    public string lat {
        get;
        set;
    }
    public string lng {
        get;
        set;
    }
    public string data {
        get;
        set;
    }
    public Options options {
        get;
        set;
    }
}

private void SetMap () {
    Options opt = new Options();
    List<Aux> aux = new List<Aux>();

    //this is to make the code to work with dinamic content
    string[] latitude = new string[3];
    string[] longitude = new string[3];
    string[] designacao = new string[3];

    latitude[0] = "38.713852";
    latitude[1] = "39.825751";
    latitude[2] = "38.730638";

    longitude[0] = "-9.145621";
    longitude[1] = "-7.479642";
    longitude[2] = "-9.139604";

    designacao[0] = "Loja centro de Braga";
    designacao[1] = "Apartamento T3";
    designacao[2] = "sxpto";

    for (int i=0; i< 3; i++){
        opt.icon = "../layout/icon_map_point.png";

        //this is what it's really needed
        aux.Add(new Aux {lat = latitude[i], lng = longitude[i], data = "div align=left class=gmapsoverlay><span>"+designacao[i]+"</span></div>", options = opt});
    }
    // end of dinamic content

    if(aux != null) {
        //parse the whole object to JSON
        var jsonSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        string json = jsonSerializer.Serialize(aux);
        hdd_GmapPoints.Value = json;

    }

}

在 JavaScript 端，只需解码隐藏字段

var aux = $("#<%=hdd_GmapPoints.ClientID %>").val();
var points2 = JSON.parse(aux);