Question

我有一个ASP.NET MVC项目，在其中一个页面上，我有以下代码，并在底部有一个脚本...

@model IEnumerable<PixelBox.Dtos.ItemGetDto>

@{
    ViewBag.Title = "Index";
}
<body>
    <h2>Index</h2>

    <p>
        @Html.ActionLink("Create New", "Create")
    </p>
    @foreach (var item in Model)
    {
        var dateString = item.DateListed.ToShortDateString();
        var imagePath = item.ImagePath.ToString() + ".png";



        <div class="card" style="width: 18rem; display:inline-block;">
            <img class="card-img-top" src="~/ItemImages/@imagePath" + alt="Card image cap">
            <div class="card-body">
                <h5 class="card-title"> @Html.DisplayFor(modelItem => item.Name) </h5>
                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
            </div>
            <ul class="list-group list-group-flush">
                <li class="list-group-item">Price:   @Html.DisplayFor(modelItem => item.Price)</li>
                <li class="list-group-item">Date Listed:  @dateString</li>
            </ul>
            <div class="card-body">
                <input type="button" value="Use Shipping Address" id="AddToBasket" />
            </div>
        </div>
    }
</body>
<script type="text/javascript" >
    $(document).ready(function () {

        function AddToBasket(id) {
            debugger;
        }

    })
</script>

但是，当它呈现时，它在DEV工具上表示无法加载资源

我的布局页面中有以下代码...

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)

</head>

还有我的捆绑包配置...

 public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at https://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/site.css"));
        }

我检查了文件的路径，它是正确的

Answer 1

您应该为页面添加布局

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

并且由于您的版面中有节脚本，因此应在其中移动脚本。

@section scripts {
 <script>
    $(document).ready(function () {
        alert('ok?')
        function AddToBasket(id) {
            debugger;
        }
    })
</script>
}

脚本标记无法加载资源状态404

1 个答案: