Question

我想将外部js文件中的jquery（jqplot）函数链接到我的jsp，但是当我这样做时，图表不会生成。

是否出现此问题是因为我在$.jqplot.config.enablePlugins = true; var d1 = ${finalScorepercent} var d2 = 100 - ${finalScorepercent} var data = [ ['FinalScore', d1], ['f', d2], ]; var plot4 = $.jqplot('finalScorepercent', [data], { seriesDefaults: { // make this a donut chart. renderer: $.jqplot.DonutRenderer, rendererOptions: { fillToZero: true, // Donut's can be cut into slices like pies. sliceMargin: 3, // Pies and donuts can start at any arbitrary angle. startAngle: -90, /* showDataLabels: true, */ // By default, data labels show the percentage of the donut/pie. // You can show the data 'value' or data 'label' instead. /* dataLabels: 'label', */ // "totalLabel=true" uses the centre of the donut for the total amount totalLabel: true, showDataLabels: true, dataLabels: 'value' } }, grid: { background: 'transparent', borderColor: 'transparent', shadow: false, drawGridLines: false, gridLineColor: 'transparent', borderWidth: '0' }, seriesColors: [ '#57c1b4', '#bd66a9', '#abb3b6' ], negativeSeriesColors: ["#498991", "#C08840", "#9F9274"], highlighter: { show: true, useAxesFormatters: false, tooltipAxes: 'xy', formatString: '%s:%s' } });

中通过JSTL动态获取数据

我在external.js中的jquery代码

<div id="finalScorepercent" style="height: 200px; width: 200px;">
<script type="text/javascript" src="<c:url value="/views/js/external.js">">                                     
</script>
</div>

这是我的jsp代码

function createTable(data, id) {
  for (var i = 0; data.length > i; i += 1) {
    var tr = '<tr>';
    for (var j = 0; data[i].length > j; j += 1) {
      tr += '<td>' + data[i][j]; + '</td>';
    }
    tr += '</tr>';
    $("#" + id).append(tr);
  }
}

Answer 1

${finalscorepercent}是一个JSTL语句，它不会在JavaScript文件中呈现为Number，因此您的代码不起作用。

您可以在模板文件中创建一个JavaScript变量，该变量可以在 external.js 中使用，

HTML 的

<div id="finalScorepercent" style="height: 200px; width: 200px;">
<div>
<script>    
    window.finalScorepercent = ${finalScorepercent};
</script>
<script src="<c:url value="/views/js/external.js">">                                        
</script>

现在在external.js文件中，您可以使用window.finalScorepercent代替${finalScorepercent}

var d1 = window.finalScorepercent;
var d2 = 100 - window.finalScorepercent;

在我的spring mvc app中从jsp调用外部js中的jquery函数

1 个答案: