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关于这个话题。