Question

有谁知道如何将C＃ASP.NET数组传递给JavaScript数组？示例代码也很不错。

很抱歉，如果我早先模糊的话。问题其实很简单。让我们说，为简单起见，我在aspx.cs文件中声明：

int [] numbers = new int[5];

现在我想将numbers传递给客户端，并在JavaScript中使用数组中的数据。我该怎么做？

Answer 1

使用System.Web.Script.Serialization.JavaScriptSerializer类序列化它并分配给javascript var

虚拟样本：

<% var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); %>
var jsVariable = <%= serializer.Serialize(array) %>;

Answer 2

这是为了补充zerkms的答案。

要跨语言障碍传递数据，您需要一种通过序列化数据将数据表示为字符串的方法。 JavaScript的序列化方法之一是JSON。在zerkms的示例中，代码将放在aspx页面内。要在一个aspx页面上将他的示例和你的例子组合在一起，你就可以了，

<%
    int[] numbers = new int[5];
    // Fill up numbers...

    var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
%>

稍后在aspx页面上的某个地方

<script type="text/javascript">
    var jsVariable = <%= serializer.Serialize(numbers) %>;
</script>

但是，这个答案假设您从初始页面加载生成JavaScript。根据你帖子中的评论，这可以通过AJAX完成。在这种情况下，您将让服务器响应序列化的结果，然后使用您喜欢的框架在JavaScript中反序列化它。

注意：也不要将此标记为答案，因为我希望语法高亮显示另一个答案更清晰。

Answer 3

您可以使用ClientScript.RegisterStartUpScript将javascript注入Page_Load页面。

以下是MSDN参考的链接： http://msdn.microsoft.com/en-us/library/asz8zsxy.aspx

以下是Page_Load中的代码：

  List<string> tempString = new List<string>();
  tempString.Add("Hello");
  tempString.Add("World");

  StringBuilder sb = new StringBuilder();
  sb.Append("<script>");
  sb.Append("var testArray = new Array;");
  foreach(string str in tempString)
  {
    sb.Append("testArray.push('" + str + "');");
  }
  sb.Append("</script>");

  ClientScript.RegisterStartupScript(this.GetType(), "TestArrayScript", sb.ToString());

注意：使用StringBuilder构建脚本字符串，因为它可能很长。

这是在您使用之前检查注入数组“testArray”的Javascript：

if (testArray)
{
  // do something with testArray
}

这里有两个问题：

有些人认为这会引发C＃注入Javascript
我们必须在全局范围内声明数组

如果您不能忍受这种情况，另一种方法是让C＃代码将Array保存到View State，然后让JavaScript使用PageMethods（或Web服务）回调服务器以获取该View State对象作为数组。但我认为这样的事情可能有点过头了。

Answer 4

在页面文件中：

<script type="text/javascript">
    var a = eval('[<% =string.Join(", ", numbers) %>]');
</script>

在代码背后：

public int[] numbers = WhatEverGetTheArray();

Answer 5

对于对象数组：

var array= JSON.parse('@Newtonsoft.Json.JsonConvert.SerializeObject(numbers)'.replace(/&quot;/g, "\""));

对于int的数组：

 var array= JSON.parse('@Newtonsoft.Json.JsonConvert.SerializeObject(numbers)');

Answer 6

我想出了类似的情况，我很容易安静地解决它。这就是我所做的。假设您已在aspx.cs页面的数组中包含值。

1）在aspx页面中放入一个隐藏字段，然后使用隐藏字段ID存储数组值。

 HiddenField2.Value = string.Join(",", myarray);

2）现在隐藏字段已存储值，只用逗号分隔。像这样在JavaScript中使用这个隐藏字段。只需在JavaScript中创建一个数组，然后通过删除逗号将值存储在该数组中。

var hiddenfield2 = new Array();
hiddenfield2=document.getElementById('<%=HiddenField2.ClientID%>').value.split(',');

这可以解决您的问题。

Answer 7

这是另一种替代解决方案。您可以使用ClientScriptManager Page.ClientScript.RegisterArrayDeclaration。这是图表数据的示例。

var page = HttpContext.Current.CurrentHandler as Page;

_data = "[Date.UTC(2018, 9, 29, 0, 3), parseFloat(21.84)]
         ,[Date.UTC(2018, 9, 29, 0, 13), parseFloat(21.84)]
         ,[Date.UTC(2018, 9, 29, 0, 23), parseFloat(21.83)]
         ,[Date.UTC(2018, 9, 29, 0, 33), parseFloat(21.83)]";
page.ClientScript.RegisterArrayDeclaration("chartdata0", _data);

此代码在客户端创建一个数组

var chartdata0 = new Array([Date.UTC(2018, 9, 29, 0, 3), parseFloat(21.84)]
             ,[Date.UTC(2018, 9, 29, 0, 13), parseFloat(21.84)]
             ,[Date.UTC(2018, 9, 29, 0, 23), parseFloat(21.83)]
             ,[Date.UTC(2018, 9, 29, 0, 33), parseFloat(21.83)]);

请参阅以下文章

https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.clientscriptmanager.registerarraydeclaration?view=netframework-4.8

此解决方案在chrome 64浏览器上使用更大的数组存在问题，包括“版本78.0.3904.70（官方内部版本）（64位）”。您可能会收到“ Uncaught RangeError：超出最大调用堆栈大小”。但是，它可以与IE11，Microsoft Edge和FireFox一起使用。

Answer 8

简单

整数数组很容易传递。但是，该解决方案也适用于更复杂的数据。在您的模型中：

public int[] Numbers => new int[5];

在您的视图中：

numbers = @(new HtmlString(JsonSerializer.Serialize(Model.Numbers)))

可选

传递字符串的技巧。您可能希望JSON编码器不要在字符串中转义一些符号。在此示例中，我想要原始未转义的西里尔字母。在您的视图中：

strings = @(
new HtmlString(
    JsonSerializer.Serialize(Model.Strings, new JsonSerializerOptions
    {
        Encoder = JavaScriptEncoder.Create(
            UnicodeRanges.BasicLatin,
            UnicodeRanges.Cyrillic)
    })))

将C＃ASP.NET数组传递给Javascript数组

8 个答案:

简单

可选