问题：ASP.NET 无法识别外部脚本

Question

我有一个简单但非常烦人的问题。我有一个使用 Razor 作为视图引擎的 ASP.NET MVC3 应用程序。

我有两个从局部视图调用的脚本，如果我将整个代码放在 _layout 页面中，它们会很好地工作。如果我将脚本放在外部文件中并引用它们，它们就不起作用。怎么可能？我已经检查了基本问题，例如文件位置和脚本标签的语法。

这是 JavaScript 代码：

$(document).ready(function () {
$('#Year').change(function () {
    var selectedYear = $(this).val();
    if (selectedYear != null && selectedYear != '') {
        $.getJSON('@Url.Action("Months", "Home")', { year: selectedYear }, function (months) {
            var monthsSelect = $('#Month');
            monthsSelect.empty();
            $.each(months, function (index, month) {
                monthsSelect.append($('<option/>', {
                    value: month.value,
                    text: month.text
                }));
            });
        });
    }
}).change();

});

这里是 _Layout 文件中的参考：

<script src="../../Scripts/CascadeDropDownList.js" type="text/javascript"></script>

这是将 Json 结果返回给视图的操作方法：

public ActionResult Months(int year)
    {
        if (year == DateTime.Now.Year)
        {
            return Json(
                Enumerable.Range(1, (DateTime.Now.Month -1)).Select(m => new 
                {
                    value = m,
                    text = CultureInfo.CurrentCulture.DateTimeFormat.GetMonthName(m)
                }),
                JsonRequestBehavior.AllowGet
            );
        }
        return Json(
            Enumerable.Range(1, 12).Select(m => new 
            {
                value = m,
                text = CultureInfo.CurrentCulture.DateTimeFormat.GetMonthName(m) 
            }),
            JsonRequestBehavior.AllowGet
        );
    }

堆栈：

[ArgumentException: Illegal characters in path.]
   System.IO.Path.CheckInvalidPathChars(String path) +126
   System.IO.Path.Combine(String path1, String path2) +38
   System.Web.Configuration.UserMapPath.GetPhysicalPathForPath(String path, VirtualDirectoryMapping mapping) +114
   System.Web.Configuration.UserMapPath.GetPathConfigFilename(String siteID, VirtualPath path, String& directory, String& baseName) +82
   System.Web.Configuration.UserMapPath.MapPath(String siteID, String path) +58
   System.Web.Hosting.HostingEnvironment.MapPathActual(VirtualPath virtualPath, Boolean permitNull) +301
   System.Web.Hosting.HostingEnvironment.MapPathInternal(VirtualPath virtualPath, Boolean permitNull) +51
   System.Web.CachedPathData.GetPhysicalPath(VirtualPath virtualPath) +39
   System.Web.CachedPathData.GetConfigPathData(String configPath) +704
   System.Web.CachedPathData.GetVirtualPathData(VirtualPath virtualPath, Boolean permitPathsOutsideApp) +110
   System.Web.HttpContext.GetFilePathData() +36
   System.Web.HttpContext.GetConfigurationPathData() +26
   System.Web.Configuration.RuntimeConfig.GetConfig(HttpContext context) +43
   System.Web.Configuration.CustomErrorsSection.GetSettings(HttpContext context, Boolean canThrow) +41
   System.Web.HttpResponse.ReportRuntimeError(Exception e, Boolean canThrow, Boolean localExecute) +101
   System.Web.HttpRuntime.FinishRequest(HttpWorkerRequest wr, HttpContext context, Exception e) +397
</pre></code>

提前致谢

Answer 1

问题是 JS 文件没有被 razor 解析器处理，所以这个代码是在客户端上渲染的，完全是这个

$(document).ready(function () {
$('#Year').change(function () {
    var selectedYear = $(this).val();
    if (selectedYear != null && selectedYear != '') {
        $.getJSON('@Url.Action("Months", "Home")', { year: selectedYear }, function (months) {
            var monthsSelect = $('#Month');
            monthsSelect.empty();
            $.each(months, function (index, month) {
                monthsSelect.append($('<option/>', {
                    value: month.value,
                    text: month.text
                }));
            });
        });
    }
}).change();

请注意，请求网址在客户端完全相同

@Url.Action("月", "家")

它不会被转换为真实的 URL，因为 JS 文件不是由 razor 解析器处理的。或者，实际上是任何其他解析器。这就是为什么外部文件不起作用的原因。如果你把它放在 razor 视图中，@Url.Action 会被 razor 处理并在客户端生成有效的链接

Answer 2

永远不要像这样硬编码网址：

<script src="../../Scripts/CascadeDropDownList.js" type="text/javascript"></script>

在处理 url 时始终使用 Url 助手：

<script src="@Url.Content("~/Scripts/CascadeDropDownList.js")" type="text/javascript"></script>

还要确保您的控制器操作不会引发异常，并且由于 JSON 部分，请确保它允许 GET 请求：

public ActionResult Months(int year) 
{
    var someModel = ...
    return Json(someModel, JsonRequestBehavior.AllowGet);
}

最后确保此操作返回的模型是一个集合，并且该集合的每个元素都具有text 和value 属性（区分大小写）。

您还想对脚本末尾的.change() 方法调用做什么？如果您想在页面加载时填充此下拉列表，我强烈建议您在服务器端执行此操作（在呈现此视图的相应控制器操作中）。