java - 通过 Javascript 解析 JSON 对象(对象列表)并在其中循环？

Question

好吧，我知道有问题，但我不明白是什么。

我从我编写的 Web 服务中读取了服务的 ArrayList(JSON 媒体类型)。转到该地址会返回 json 字符串。

现在我正在尝试制作一个网页来显示该值并查看对页面所做的更改，每 3 秒发出一次请求。

如何解析或使用它？阅读了很多，但我仍然要开始......

[无法将此对象传递给 JSP 并使用 JSTL 进行解析、循环和所有操作吗？那太棒了!]

这里是js代码:

 <script type="text/javascript">
setInterval(function(){
    $.ajax({ url: "/MyApp/rest/display", success: function(data){
        var objs = $.parseJSON(data);
        $.each(objs, function(i,service) {
            $("#service").append('<p>'+service+'</p>');
        });
    }, dataType: "json"});
}, 3000);
</script>

我有一个 <div id="service">

编辑:快到了!

现在我有这个:

<script type="text/javascript">
setInterval(function(){
    $.ajax({ url: "/myApp/rest/display", success: function(data){
        $.each(data, function(i,service) {
            var cont = 1;
            var newdiv = document.createElement('div');
            newdiv.setAttribute('id', "service"+i);
            $("#service"+i).html('<p>'+service.serviceId+" "+service.queue.lastNumber+'</p>');
            document.getElementById("services").appendChild(newdiv);
            cont++;
        });
    }, dataType: "json"});
}, 5000);
</script>

它获得更新和所有内容(很好!)但我有一个问题:它不断在较大的 div(空 div)中创建新的 div。我怎样才能避免这种情况？

编辑 2:

没关系，我已经完成了!只需在 appendChild 之前添加这一行:

if(!$("#service"+i).length)

像魅力一样工作。谢谢!

Answer 1

使用 JQuery，您无需解析 data，因为当您设置 dataType: "json" 时，它已被解析为 JSON。

$.ajax({ 
    url: "/MyApp/rest/display", 
    success: function(data) {
        $.each(data, function(i,service) {
            $("#service").append('<p>'+service+'</p>');
        });}, 
    dataType: "json" });

附言。如果这不起作用，请发布您的 AJAX 调用返回的 JSON。

编辑:这是 JSTL 的处理方式:创建一个 JSF 或 JSP，它不返回完整的 HTML 页面，而是返回 #service div 中您想要的内容。让我们调用页面 doit.jsp。现在我们可以使用 ajax 将其放入 #service div。

$.ajax({
    url: "doit.jsp",
    success: function(data) { $("#service").html(data); });