从razorpage调用另一个目录中的javascript函数答案

【问题标题】：Calling javascript function in another directory from razorpage从razorpage调用另一个目录中的javascript函数
【发布时间】：2019-11-15 13:03:27
【问题描述】：

我无法在我的 razorpages 项目中包含 javascript 文件。我希望能够从中调用函数，但连警报都不起作用。

我已经包含了 app.UseStaticFiles();在startup.cs中

我的 html 是这样的：

@page
@model OptimalHousing.Pages.IndexModel

@{
    ViewData["Title"] = "Index";
}

    <head>
        <script type="text/javascript" src="~/js/site.js"></script>
    </head>
<h1>Index</h1>

<p>
    <a asp-page="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Dorm[0].dormName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Dorm[0].dormUrl)
            </th>
            <th></th>
        </tr>

    </thead>
    <tbody>
        @foreach (var item in Model.Dorm)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.dormName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.dormUrl)
                </td>
                <td>
                    <a asp-page="./Edit" asp-route-id="@item.id">Edit</a> |
                    <a asp-page="./Details" asp-route-id="@item.id">Details</a> |
                    <a asp-page="./Delete" asp-route-id="@item.id">Delete</a> |
                    <a asp-page="./GetAddress" asp-route-id="@item.id">Get address</a>
                    <input type="button" id="getSearchresultsButton" name="getCoordinates" value="Get searchresults" onclick="callGetFilteredDorms()" />
                </td>
            </tr>
        }
    </tbody>

</table>
<input type="button" id="getSearchresultsButton" value="Get searchresults" onclick="javascript: dope()" />

我尝试在此目录结构中包含的文件是 site.js： http://prntscr.com/oapg36

【问题讨论】：

你想从site.js调用什么函数？不工作是什么意思？您是否在 Web 浏览器开发人员工具中收到任何错误？对于site.js，它将由.net core 和Pages/Shared/_Layout.cshtml 和<script src="~/js/site.js" asp-append-version="true"></script> 自动加载。

标签： javascript asp.net-core .net-core razor-pages

【解决方案1】：

因此，在您的页面中需要考虑一些不同的事情。首先，我认为您需要一个包含所有基本 HTML 标记的结构：

<html lang="en">
    <head>
      <meta charset="utf-8">
      <script type="text/javascript" src="js/site.js"></script>
    </head>

    <body>
        {{PUT YOUR BODY HTML HERE}}
    </body>
</html>

如果您的 javascript 已正确映射并且您说已应用 app.UseStaticFiles();。首先尝试通过以下方式访问该文件：

http://{{YOURDOMAINHERE}}/js/site.js

您是否获得了实际的 javascript 文件？如果不是，那么它没有正确映射，您需要修复您的配置。

如果是我认为上面的行是这样的：

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

应该适合你。

我在您的 C# 代码中看到的另一件事是，您使用数组的第一个元素作为表头，然后您稍后遍历 Dorm 的同一数组。这将打印相同的第一个元素两次。考虑将表头放在它们自己的变量中，而不是将它们存储在数组中。

【讨论】：

添加正确的 html 结构有效，它没有包含在微软网站的教程中，所以我认为没有必要，谢谢。