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

Question

我无法在我的 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

Answer 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# 代码中看到的另一件事是你使用数组的第一个元素作为 table header 然后你稍后迭代相同的数组 Dorm.这将打印相同的第一个元素两次。考虑将 table header 放入它们自己的变量中，而不是将它们存储在数组中。

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

Calling javascript function in another directory from razorpage

javascript

.net-core

asp.net-core

razor-pages