c# - 将像 JSON 这样的字符串从 C# 发送到 javascript

Question

我在 JavaScript 中有一些代码是这样的:

slider.setPhotos([
    { "src": "image1", "name": "n1" },
    { "src": "image2", "name": "n2" },
    { "src": "image3", "name": "n3" }
    ]);

我想在 C# 中设置 src 和 name 的值。

假设值在 C# 中是这样的:

var images = new string[] {"/images/a1.jpg", "/images/a2.jpg", "/images/a3.jpg"};

var names = new string[] {"First", "Second", "Third"};

如何将这些值设置到 JavaScript 代码中(即在 C# 代码中的 Page Load 方法中)？

Answer 1

在服务器上，您需要将数据序列化为 JSON，然后您可以使用隐藏输入字段之类的东西将其作为 HTML 写入响应。

例如，您可以使用 NewtonSoft用于序列化 JSON 的 JSON 库(内置于 ASP MVC 4 但是使用 Nuget 很容易安装)

string json = Newtonsoft.Json.JsonConvert.SerializeObject(images);

然后将 json 渲染到 HTML 中(有很多方法可以做到这一点)例如

Response.Write(string.Concat("<input id='data' type='hidden' value='", json, "' />");

或

HiddenField jsonField = new HiddenField
{
    ID = "data"
};
jsonField.Value = json;
this.Controls.Add(jsonField);

甚至直接写成脚本而无需在客户端解析(我仍然倾向于使用 HTML 方法来避免回发/更新面板的任何问题导致脚本被多次执行)

Response.Write(string.Concat("<script type='text/javascript'> var images = ", json, ";</script>");

然后您可以在客户端上从 HTML 中读取此 JSON 并对其进行解析。在现代浏览器中，这是内置的，或者您可以使用 JSON2 之类的东西进行填充。

例如

var field = document.getElenentById('data');
var images = JSON.parse(field.value);

然后您可以访问作为 Javascript 对象的数据。