Question

我和我有以下几点。我有一个包含一些值的JSON数组。我基本上使用JSON-lib使用一些groovy类从List转换为JSONArray。现在，我有一个JS文件，前端有一个JSF。

我需要遍历JS文件中的JSON数组，并且对于数组中的每个项目，我需要在JSF页面中创建一个新的div标签，并调用相应的JS函数来填充div标签。

有人可以帮我吗？我只是不确定如何迭代JSON数组并创建div标签。我已经有了与我一起填充div标签的功能。

任何帮助将不胜感激。

我正在尝试做这样的事情

Reports.generateCharts = function generateCharts(){
  var jsonDeviceArr = {"Devices" :'${reportViewproto.selectedDevices}'};

  $.each(jsonDeviceArr, function(i, val){
    function create_div(){
      var cid = "chart"+i;
      dv = document.createElement('div');
      dv.setAttribute('id', cid);
      dv.style.position="center";
      dv.style.pixelLeft=20;
      dv.style.pixelTop=100;
      dv.style.pixelWidth=10;
      dv.style.pixelHeight=20;
      dv.attachEvent("onload", 
      function(){
        generateSparkLine(cid, '');
      });
      document.forms[0].appendChild(dv);
    }
  });
}

其中'reportViewprot'是一个具有函数'getSelectedDevices（）'的bean，它将返回JSON数组。现在，这个函数'generateCharts（）'出现在一个单独的JS文件中，并且在加载JSF页面时必须加载div标签。

但这不起作用。我在这里错过了什么吗？

希望我很清楚。

感谢，S。

Answer 1

如果您使用的是jQuery，则应使用jQuery.each()。它是一个通用的迭代器函数，可用于无缝迭代对象和数组。

示例：

$.getJSON('ajax/test.json', function(data) {   
    $.each(data, function(key, value) {
        $("#parent").append("<div>" + function(key, value) + "</div>");
    });        
});

Answer 2

两点：

似乎没有人调用“create_div”函数。你为什么不删除那个函数包装器？
你的onload函数在一个闭包中捕获“dv”，这在某些浏览器上曾经导致内存泄漏（可能仍然存在）。

你可以使用jQuery来获取表单对象，然后使用append函数（正如Diogo所做的那样）创建你的div作为纯HTML（字符串形式）或菊花链jQuery函数，如append，css ，绑定等...查看jQuery网站上的示例。

这样做可以避免关闭问题，并且阅读起来可能更清晰。

迭代JSON并创建DIV标记

2 个答案: