0

我有一个自定义列表地震，其中包含地震列表。如何在 JavaScript 中解析它以便将其添加到 innerHtml 并显示在屏幕上。问题是我无法让它在 div 的屏幕上显示。当它解析时，我没有得到任何结果，因为我的 javascript 是错误的，如果我尝试只打印结果，我会得到 [Object object]

所以流程从文本框输入 -> 网络服务 -> 列表到 javascript

地震等级：

 public class earthquakes
{
    public string eqid { get; set; }

    public double magnitude { get; set; }

    public double lng { get; set; }

    public string source { get; set; }

    public DateTime date { get; set; }

    public int depth { get; set; }

    public double lat { get; set; }
}

数据地震类

public class dataPostalCodes
{
    public List<postalCodes> postalCodes { get; set; }
}

网络服务：

public static dataEarthQuakes getEarthquakes(dataPostalCodes postalCodes)
    {
        double lat = postalCodes.postalCodes[0].lat;
        double lng = postalCodes.postalCodes[0].lng;

        Uri address = new Uri(String.Format(FindEarthquakes, lat, 0, lng, 0));
        WebClient client = new WebClient();
        string jsonResponse = string.Empty;
        jsonResponse = client.DownloadString(address.AbsoluteUri);
        var results = JsonConvert.DeserializeObject<dataEarthQuakes>(jsonResponse);

        return results;
    }

Javascript：

function OnLookupComplete(e) {
    var result = e;
    var weatherData = new Sys.StringBuilder();
    var line;
    for (var property in result.dataPostalCodes) {
        line = String.format("<b>{0}:</b> {1}<br/>",
                         property, result.dataPostalCodes[property]);
        weatherData.append(line);
    }
    $get('divResult').innerHTML = weatherData.toString(); 
}

json字符串：

{"earthquakes":[{"eqid":"2010utc5","magnitude":7.7,"lng":97.1315,"src":"us","datetime":"2010-04-06 20:15:02","depth":31,"lat":2.3602}, {"eqid":"2009kdb2","magnitude":7.6,"lng":92.9226,"src":"us","datetime":"2009-08-10 17:55:39","depth":33.1,"lat":14.0129},{"eqid":"2010zbca","magnitude":7.6,"lng":123.533,"src":"us","datetime":"2010-07-23 20:51:11","depth":576.3,"lat":6.4939},{"eqid":"2010xkbv","magnitude":7.5,"lng":91.9379,"src":"us","datetime":"2010-06-12 17:26:50","depth":35,"lat":7.7477},{"eqid":"c0000rxc","magnitude":7.4,"lng":143.7392,"src":"us","datetime":"2010-12-21 16:19:41","depth":14.9,"lat":26.8656},{"eqid":"2010zbcd","magnitude":7.4,"lng":123.2677,"src":"us","datetime":"2010-07-23 21:15:08","depth":616.7,"lat":6.7489},{"eqid":"2010wbaq","magnitude":7.4,"lng":96.0805,"src":"us","datetime":"2010-05-09 03:59:44","depth":61.4,"lat":3.7284},{"eqid":"2007hvbq","magnitude":7.4,"lng":142.6846,"src":"us","datetime":"2007-09-28 11:38:58","depth":261.3,"lat":21.98},{"eqid":"2010zbbz","magnitude":7.3,"lng":123.4788,"src":"us","datetime":"2010-07-23 20:08:11","depth":604.5,"lat":6.7079},{"eqid":"2007xvam","magnitude":7.3,"lng":126.292,"src":"us","datetime":"2007-01-21 10:27:42","depth":10,"lat":1.2071}]}
4

2 回答 2

1

正如 no.good.at.coding 在评论中所说，如果您的 weatherData 对象包含正确的数据，那么它可能很简单：

$('#divResult').html(weatherData.toString());

另一种选择可能是在您的 json 对象上调用 parseJSON，然后使用 jquery 的 each 函数来遍历结果：


var results = $.parseJSON(e);
$(results).each(function (i, val) {
    $('#divResult').append('<p>' + val.eqid + '<p>'); // can add markup here for magnitude and other properties
});

如果你不确定你的对象在 javascript 中是什么，firebug是一个很好的调试工具（或者你可以使用 Chrome 内置的开发者工具）。

您没有说明确切的问题，但希望这将有助于您走上正轨。

于 2011-03-03T02:01:17.710 回答
0

这是我可能会做的：

$.get('my-webservice-url', 
    function(data) {
        OnLookupComplete(data['earthquakes']);
    }, 
    'json');

function OnLookupComplete(e) {
    var weatherData = new Sys.StringBuilder();
    for(var i=0;i<e.length;i++) {
        var line;
        for (var property in e[i].dataPostalCodes) {
            line = String.format("<b>{0}:</b> {1}<br/>",
                             property, e[i].dataPostalCodes[property]);
            weatherData.append(line);
        }
    }
    $('#divResult').html(weatherData.toString()); 
}

这里的想法是您调用您的 Web 服务并向 jQuery 指示预期的响应是 JSON（如果您没有content-type在来自服务器的响应中正确设置标头，这很有用）。

请求完成后，jQuery 将调用您的GET回调函数（您可以在对.$.get()earthquakes

然后该函数调用OnLookupComplete()每个地震数组。

OnLookupComplete()然后遍历每次地震，构建正确的字符串并将其附加到StringBuilder. 最后，一旦处理完所有地震，它会将完整的格式化线集附加到divid divResult。

于 2011-03-03T02:33:47.523 回答