ASP.NET中调用后台C#函数遇ReferenceError: System is not defined问题

嘿，我来帮你搞定这个问题！你遇到的ReferenceError: System is not defined错误，本质是因为你直接在JS里用<%= GetEvents()%>输出的是JsonResult对象的默认字符串表示（比如System.Web.Mvc.JsonResult这类），而不是真正的JSON数据，JS自然识别不了这个System开头的东西。下面给你两种靠谱的解决方案：

方案一：直接输出序列化后的JSON字符串（适合简单同步场景） #

修改后台方法，把数据直接序列化为JSON字符串，而不是返回JsonResult对象：

protected string GetEventsJson()
{
    using (DatabaseEntities dc = new DatabaseEntities())
    {
        var events = dc.Events.ToList();
        // 使用JavaScriptSerializer序列化对象为JSON字符串
        var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        return serializer.Serialize(events);
    }
}

然后在前台JS里这样调用：

// 直接获取序列化后的JSON，JS能直接解析
var data = <%= GetEventsJson() %>;
// 现在可以正常使用data了
console.log(data);

方案二：用AJAX异步调用后台方法（更推荐，适合动态加载场景） #

这种方式前后端分离，体验更好，也更符合现代Web开发的习惯。

如果是WebForms项目（.aspx页面） #

先把后台方法改成静态的，并加上[WebMethod]标记：

[System.Web.Services.WebMethod]
public static string GetEvents()
{
    using (DatabaseEntities dc = new DatabaseEntities())
    {
        var events = dc.Events.ToList();
        var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        return serializer.Serialize(events);
    }
}

然后用jQuery的AJAX调用（如果没引入jQuery，记得先引入）：

$.ajax({
    type: "POST",
    url: "Kalender.aspx/GetEvents", // 对应你的页面路径+方法名
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(response) {
        // WebForms的WebMethod会把结果包裹在response.d里
        var data = JSON.parse(response.d);
        // 在这里处理获取到的事件数据
        console.log("获取到的事件：", data);
    },
    error: function(xhr, status, error) {
        console.error("加载事件失败：", error);
    }
});

如果是MVC项目 #

把GetEvents方法移到对应的Controller里（确保是public的Action）：

public JsonResult GetEvents()
{
    using (DatabaseEntities dc = new DatabaseEntities())
    {
        var events = dc.Events.ToList();
        return Json(events, JsonRequestBehavior.AllowGet);
    }
}

然后用AJAX调用：

$.ajax({
    type: "GET",
    url: "/YourControllerName/GetEvents", // 替换成你的Controller名称
    dataType: "json",
    success: function(data) {
        // 直接使用返回的JSON数据
        console.log("获取到的事件：", data);
    },
    error: function(xhr, status, error) {
        console.error("加载事件失败：", error);
    }
});

为什么原来的写法会报错？ #

<%= GetEvents() %>会把后台方法返回的JsonResult对象直接转换成字符串输出，最终页面上会显示类似System.Web.Mvc.JsonResult这样的内容——这显然不是有效的JS数据，JS引擎看到System这个陌生的标识符，就会抛出ReferenceError: System is not defined的错误。

内容的提问来源于stack exchange，提问作者Mar Tin