Question

我有一个struts 2动作类，它带有一个返回json数据的方法。

我的jsp上有8个标签。当用户单击选项卡时，我想对此方法进行ajax调用。我希望使用可以在此选项卡中呈现的html解析和修饰返回的json数据。

我正在使用jquery标签来制作tabs。

如何捕获返回的json数据？我可以订阅jquery发布的一些事件吗？
如何处理返回的json数据？例如; json数据：

{城市：{name =“New York”，alias =“NY”，imgPath =“filePath / img1.jgp”}}

我想提取名称并加粗。使用imgPath定义img标签等

Answer 1

 $(document).ready(function () {
            var data = { "City": [{ "name": "New York1", "alias": "NY1", "imgPath": "filePath/img1.jgp" }, { "name": "New York2", "alias": "NY2", "imgPath": "filePath/img2.jgp" }, { "name": "New York3", "alias": "NY3", "imgPath": "filePath/img3.jgp" }, { "name": "New York4", "alias": "NY4", "imgPath": "filePath/img4.jgp"}] };

            if (data.City.length > 0) {
                $('body').prepend('<div id="tabs1"><ul></ul></div>');

                $.each(data.City, function (i, entity) {
                    $('#tabs1 ul').append($('<li><a href="#tabs1-' + (i + 1) + '">' + entity.name + '</a></li>'));
                    $('#tabs1').append('<div id="tabs1-' + (i + 1) + '"><p>Image Path:' + entity.imgPath + '</p></div>');
                });

                $("#tabs1").tabs();
            }
        });

直播演示，请参阅此链接：http://jsfiddle.net/nanoquantumtech/ffbx5/

Answer 2

您可以通过将data参数传递给ajax调用成功回调方法来捕获返回的Json数据，该方法将在成功时执行。 http://api.jquery.com/jQuery.ajax/

您可以使用jQuery parse.json方法并将json字符串传递给它。 http://api.jquery.com/jQuery.parseJSON/

您的示例json字符串不再是有效的一个。您只需粘贴json数据或粘贴网址，即可通过此链接http://jsonlint.com/检查您的json是否有效。

如何在每个选项卡中显示使用ajax获取的json数据

2 个答案: