使用Literal后面的代码中的Javascript

时间:2018-01-30 11:51:46

标签: javascript c# webforms

我正在尝试在代码中编写我的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;这些标签可能是错误的。如果我犯了错误,请告诉我。

2 个答案:

答案 0 :(得分: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);

答案 1 :(得分:0)

在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 >";