javascript - 如何在 javascript 中嵌入 JSTL forEach

Question

我正在尝试使用 JavaScript 中的 JSTL forEach 标记遍历对象列表(一些测量数据)，并使用 Google Charts API 显示数据。代码如下所示。但是看起来有点不对劲。当我仔细检查时，测量对象列表中的数据可以正常传递到 ${listOfMeasurements}、${measurements.measTime}、$ 中的 html {measurements.measS1raw} 和 ${measurements.measS2raw}。但是在 javascript block 中，forEach 代码无法按预期执行 data.addRow()。我的猜测是，我没有在我的 javascript 代码中正确使用 forEach，所以 data.addRow() 没有按预期执行。我该如何解决？

<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Date');
    data.addColumn('number', 'measurement1');
    data.addColumn('number', 'measurement2');
     <c:forEach items="${listOfMeasurements}" var="measurements">
        "data.addRow("
        +"${measurements.measTime}"+","
        +"${measurements.measS1raw}"+","
        +"${measurements.measS2raw}"+");"
        ;
     </c:forEach>

    var options = {
      title: 'Measurements'
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);

  }
</script>

Answer 1

这样试试

<c:forEach items="${listOfMeasurements}" var="measurements">
   data.addRow(${measurements.measTime},${measurements.measS1raw},${measurements.measS2raw});
</c:forEach>

否则你会在脚本中得到错误的代码，例如:

"data.addRow("+"measTimeValue-1"+","+"measS1raw-1"+","+"measS2raw-1"");";
"data.addRow("+"measTimeValue-2"+","+"measS1raw-2"+","+"measS2raw-2"");";
"data.addRow("+"measTimeValue-3"+","+"measS1raw-3"+","+"measS2raw-3"");";

...这是不正确的 javascript。

混合使用 JSP 标记和 Javascript 的问题在于它们出现在两个不同的阶段。JSP 渲染是第一位的，所以所有的 html、css 和 javascript 代码都只是另一个字符串。因此，在 JSP 呈现完成后，您只有 HTML。

您可能想阅读 this blog entry来自 BalusC关于这个话题。