将特定于视图的 JavaScript 添加到 Asp.Net Core 2 MVC 应用程序的首选方法是什么？答案

【问题标题】：What the preferred way to add view-specific JavaScript to an Asp.Net Core 2 MVC application?将特定于视图的 JavaScript 添加到 Asp.Net Core 2 MVC 应用程序的首选方法是什么？
【发布时间】：2018-10-20 03:56:23
【问题描述】：

我有想要添加到单个 Razor 视图 (CSHTML) 的 JavaScript，它应该与过滤 TABLE 的 input 相关联：

$(document).ready(function () {

    // added for testing
    alert('ready');

    (function ($) {

        $('#filter').keyup(function () {

            var rex = new RegExp($(this).val(), 'i');
            $('.searchable tr').hide();
            $('.searchable tr').filter(function () {
                return rex.test($(this).text());
            }).show();

        })

    }(jQuery));

});

目前，代码包含在位于视图底部的SCRIPT 标记中。

当页面加载时，警报永远不会触发。

如果我包装SCRIPT:

@section Head {
    <script type="text/javascript">
        $(document).ready(function () {
            // your code goes here
        });
    </script>
}

产生了这个错误：

InvalidOperationException：已定义以下部分但尚未由页面呈现 '/Views/Shared/_Layout.cshtml'：'头部'。忽略未渲染的节调用 IgnoreSection("sectionName")。

将特定于视图的 JavaScript 添加到 Asp.Net Core 2 MVC 应用程序的首选方法是什么？

【问题讨论】：

标签： javascript asp.net-core-mvc asp.net-core-2.0

【解决方案1】：

找到答案了。

我将 JAVASCRIPT 包裹在 @section Scripts 块中：

@section Scripts {
    <script type="text/javascript">
    $(document).ready(function () {

        alert('ready');

        (function ($) {

            $('#filter').keyup(function () {

                var rex = new RegExp($(this).val(), 'i');
                $('.searchable tr').hide();
                $('.searchable tr').filter(function () {
                    return rex.test($(this).text());
                }).show();

            })

        }(jQuery));

    });
    </script>
}

这似乎是由 _Layout.cshtml 中的 @RenderSection("Scripts", required: false) 调用的。

一旦我这样做并重新加载页面，就会触发警报，其余代码按预期工作。

【讨论】：