Question

我正在尝试在代码中编写我的js代码。我已经定义了一个名为“contentPie”的文字，然后将javascript代码放在它的文本中。但它不起作用。

contentPie.Text = "<script>window.onload = function() {var chart = new CanvasJS.Chart(" + chartContainer + ", { animationEnabled: true,data: [{type: \"pie\",startAngle: 240,indexLabel: \"{label} {y}\",dataPoints: [{ y: 79.45, label: \"Javascript\" },{ y: 7.31, label: \"CSS\" },{ y: 7.06, label: \"Image\" },{ y: 4.91, label: \"HTML\" },{ y: 1.26, label: \"Others\" }]}]});chart.render();}</ script >";

P.s，这个javascript代码是一个饼图模板。以下是来源：https://canvasjs.com/html5-javascript-pie-chart/。

顺便说一下我不确定但是＆lt;＆lt; \“＆gt;＆gt;这些标签可能是错误的。如果我犯了错误，请告诉我。

Answer 1

不太确定在服务器端编写客户端代码背后的原因。通常这不是必要的，也不是这种方式的好习惯。

但根据您自己的情况，我认为您正在尝试将一些服务器端值传递给javascript代码，以便可以呈现饼图。

有几种方法可以做到这一点

使用服务器端标记

var chartContainer = <%= chartContainerFromCodeBehind %>;
<script>window.onload = function() { // your javascript code... }</ script >

使用ClientScriptManager类

var yourJs = "window.onload = function() { ... }";
Page.ClientScript.RegisterStartupScript(GetType(), "yourKey", yourJsCode,true);

Answer 2

在Text前面附加@并且每件事情都很好。不需要\＆＃34; 在＃34;内部使用单引号（＆＃39;）＆＃39;馅饼＆＃39; ＆＃34;而不是双引号（＆＃34;）

contentPie.Text = @"<script>window.onload = function() {var chart = new CanvasJS.Chart(" + chartContainer + ", { animationEnabled: true,data: [{type: 'pie',startAngle: 240,indexLabel: '{label} {y}',dataPoints: [{ y: 79.45, label: 'Javascript' },{ y: 7.31, label: 'CSS' },{ y: 7.06, label: 'Image' },{ y: 4.91, label: 'HTML' },{ y: 1.26, label: 'Others' }]}]});chart.render();}</ script >";

使用Literal后面的代码中的Javascript

2 个答案: