如何在javascript中嵌入JSTL forEach_Javascript_Jsp_Jstl

如何在javascript中嵌入JSTL forEach

javascript jsp

如何在javascript中嵌入JSTL forEach,javascript,jsp,jstl,Javascript,Jsp,Jstl,我试图在javascript中使用JSTL forEach标记遍历对象列表（一些测量数据），并使用GoogleCharts API显示数据。代码如下所示。但看起来有些不对劲。当我仔细检查时，度量对象列表中的数据可以很好地传递到${listOfMeasurements}，${measures.measteme}，${measures.measS1raw}和${measures.measS2raw}中的html。但是在javascript块中，forEach代码无法按预期执行data.addRow（

我试图在javascript中使用JSTL forEach标记遍历对象列表（一些测量数据），并使用GoogleCharts API显示数据。代码如下所示。但看起来有些不对劲。当我仔细检查时，度量对象列表中的数据可以很好地传递到

${listOfMeasurements}

，

${measures.measteme}

，

${measures.measS1raw}

和

${measures.measS2raw}

中的html。但是在javascript块中，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>


load（“可视化”、“1”、{packages:[“corechart”]}）；
setOnLoadCallback（drawChart）；
函数绘图图（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'string'，'Date'）；
data.addColumn（'number'，'measurement1'）；
data.addColumn（'number'，'measurement2'）；
“data.addRow（”
+“${measurements.measTime}”+，”
+“${measurements.measS1raw}”+“，”
+“${measurements.measS2raw}”+”
;
变量选项={
标题：“测量”
};
var chart=new google.visualization.LineChart（document.getElementById（'chart_div'））；
图表绘制（数据、选项）；
}

像这样试试看

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

…这是不正确的javascript

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

您可能需要阅读有关此主题的文章。

这可能是另一种解决方案

function drawBasic() {

        var data = google.visualization.arrayToDataTable([
            ['Date', 'measurement1','measurement2']
            <c:forEach var="measurements" items="${listOfMeasurements}">
                ,[${measurements.measTime},${measurements.measS1raw},${measurements.measS2raw}]
            </c:forEach>
        ]);         

      var options = {
        title: 'Change title Acoordingly',
        chartArea: {width: '50%'},
        hAxis: {
          title: 'Change title Acoordingly',
          minValue: 0
        },
        vAxis: {
          title: 'Change title Acoordingly'
        }
      };

      var chart = new google.visualization.BarChart(document.getElementById('chart_div'));

      chart.draw(data, options);
    }
</script>

<body><div id="chart_div"></div></body>

函数{
var data=google.visualization.arrayToDataTable([
['Date'、'measurement1'、'measurement2']
，[${measurements.measteme}，${measurements.measS1raw}，${measurements.measS2raw}]
]);         
变量选项={
标题：“按顺序更改标题”，
图表区：{宽度：'50%}，
哈克斯：{
标题：“按顺序更改标题”，
最小值：0
},
言辞：{
标题：“按顺序更改标题”
}
};
var chart=new google.visualization.BarChart（document.getElementById（'chart_div'））；
图表绘制（数据、选项）；
}

for中没有引号的情况下尝试。在

forEach

eyes

data.addRow（…）

中，它已经只是一些字符串了。您需要意识到JSP是一个HTML代码生成器，JS是HTML的一部分。在浏览器中打开JSP页面，右键单击并查看源代码。仔细看看JSP生成的HTML/JS代码语法。可以吗？如果没有，只需相应地修复JSP代码，以便它准确地生成所需的HTML/JS代码输出。如果仍然无效，请复制粘贴该HTML输出而不是JSP源代码，并在HTML上下文而不是JSP上下文中重新构造问题。检查HTML源代码非常有用@巴卢斯克，谢谢你的建议。对不起，我不想发布。编辑。addRow（'${measurements.measTime}'，${measurements.measS1raw}，${measurements.measS2raw}）；它的工作原理如上图所示。我的EclipseIDE抱怨语法错误，但有点奇怪。

function drawBasic() {

        var data = google.visualization.arrayToDataTable([
            ['Date', 'measurement1','measurement2']
            <c:forEach var="measurements" items="${listOfMeasurements}">
                ,[${measurements.measTime},${measurements.measS1raw},${measurements.measS2raw}]
            </c:forEach>
        ]);         

      var options = {
        title: 'Change title Acoordingly',
        chartArea: {width: '50%'},
        hAxis: {
          title: 'Change title Acoordingly',
          minValue: 0
        },
        vAxis: {
          title: 'Change title Acoordingly'
        }
      };

      var chart = new google.visualization.BarChart(document.getElementById('chart_div'));

      chart.draw(data, options);
    }
</script>

<body><div id="chart_div"></div></body>