0

我最近一直在使用 XML,但现在我正在练习一些 JSON。

我想要做的是制作一个按钮和文本框 - 这样用户就可以输入一个邮政编码,它会得到该邮政编码的信息......

使用来自 geonames.org 的 JSON

试图弄清楚这一点让我感到沮丧,当我使用 XML 制作自己的文件时,我发现这很容易,但现在我正在尝试使用实际的网站和 JSON。

请告诉我如何做到这一点!将不胜感激!谢谢。

4

2 回答 2

0

首先,HTML 无法处理来自服务器的 json 响应。您可以将 json 格式的 get 或 post 发送到服务器并返回 json 响应,但您需要 HTML 以外的其他内容来处理该 JSON 消息。浏览器可以格式化和显示 XML,但不能显示 JSON(它们只是将其显示为字符串)。在浏览器中执行此操作的最简单方法是使用 JavaScript。为此,我建议使用 jquery 库。

http://jquery.com

这是我最近用来处理返回的 JSON 字符串的一些 jquery 的示例。

$(document).ready(function() {

    $(".img a").on("click", function(event) {
        event.preventDefault();
        var item;
        if ((item= $(this).attr( 'href' ))=="saved") return false;
        $(this).html("<div style='line-height:4em '>Saved</div>");
        $(this).attr("href","saved");
        var action ="add";

        jqxhr = $.post("webservice.php", { action: action, color: item }, function(data) {
            var result=data.result;
            if (result=="saved") {
                self.html("<div>Saved</div>");
                self.attr("href","saved");
            }           
        }, "json")
        .error(function() {         
            alert("error: unable to contact web service"); 
        });
    });
}); 

此请求返回的 JSON 字符串为 { result: saved }。如您所见,您可以将关联的数组作为数据对象的一部分进行访问。在我的例子中,data.result 为我提供了来自 json 字符串的结果值。

请注意,我的示例是使用锚标记传递要在 web 服务调用中发送的值。在您的情况下,您将需要使用表格。

于 2012-11-24T06:16:40.033 回答
0

如果您使用的是jeoquery,那么只需查看UI 示例的 html 源代码。它显示了相同的自动完成框,您可能试图实现不编写自定义代码来解析返回的 JSON。下面的代码应该适合你:

<input class="input-large" id="city" type="text"/>

$("#city").jeoCityAutoComplete();
于 2012-11-24T06:45:55.803 回答