ASP.net中的JavaScript/jQuery MVC布局页面无法正常工作

Den*_*niz 1 javascript asp.net-mvc jquery alert

Chrome浏览器中启用了JavaScript.我希望在单击某个段落时显示警报.为什么它不起作用?!如果我有JavaScript工作,我认为jQuery也可以工作.

这是_Layout.cshtml页面:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/Scripts/jquery-1.7.1.js")
    @Scripts.Render("~/bundles/modernizr")

    <script>
        $(document).ready(
            $("#para").click(function() {
                alert("you clicked the paragraph");
            })
        );
    </script>
</head>
<body>
    <p id="para">Some paragraph</p>

 @Scripts.Render("~/bundles/jquery")
 @RenderSection("scripts", required: false)
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

Dar*_*rov 5

你已经两次包括jquery.一旦进入头部,一次进入头部.试试这样:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    <p id="para">Some paragraph</p>

    @Scripts.Render("~/bundles/jquery")
    <script type="text/javascript">
        $("#para").click(function() {
            alert("you clicked the paragraph");
        });
    </script>
    @RenderSection("scripts", required: false)
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

@Scripts.Render("~/bundles/jquery")调用使用ASP.NET MVC 4新的捆绑机制,其中包括jQuery.查看您的~/App_Start/BundleConfig.cs文件以查看其配置方式.另请注意我的示例中是如何删除document.ready调用的,因为我已经将脚本放在文档的末尾,因此不再需要它.