簡潔的JavaScript-找不到單獨的JS文件

Question

使用不引人注目的JavaScript的概念，我第一次嘗試將JavaScript放在與HTML分開的單獨文件中。 但是，無論我做什么，都會收到未找到文件的錯誤。

這是Google Chrome控制台（ctrl-shift-j）中的實際錯誤：

GET http://localhost:14385/Home/TestPage.js 404 (Not Found)

我從一個新的MVC 4應用開始。 我創建了一個新的測試頁面：

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <meta name="viewport" content="width=device-width" />
    <script src="TestPage.js"></script>
    <title></title>
</head>
<body>
    <div>
        <input id="foo" value="snuh" />
    </div>
</body>
</html>

我在同一文件夾中創建了一個新的TestPage.js：

$(document).ready(function() {

    function dosomething() {
        alert('snuh');
    }

    document.getElementById('foo').onclick = dosomething;
});

我嘗試過這里發布的技巧，但總是會收到一個錯誤消息，即未找到JavaScript文件。 知道這個簡單的測試怎么了嗎？

注意：實際上會顯示TestPage，並顯示輸入框。

這是解決方案資源管理器中的布局：

在此處輸入圖片說明

Answer 1

確保使用服務器端幫助程序從正確的位置引用您的JavaScript：

<script src="<%= Url.Content("~/TestPage.js") %>"></script>

無論您從哪個位置渲染了此視圖，這都將正確引用javascript文件。 顯然，它假定您已將javascript文件放置在應用程序的根目錄中。 約定是為此使用Scripts文件夾：

<script src="<%= Url.Content("~/Scripts/TestPage.js") %>"></script>

更新：

現在，您已經顯示了項目結構，您似乎已經將TestPage.js文件放置在~/Views文件夾中。 這行不通。 無法從客戶端訪問此文件夾。 IIS明確禁止並且不提供此服務。 切勿在其中放置任何靜態文件。 將您的javascript文件夾移至~/Scripts文件夾。

另外，您似乎在TestPage.js文件中使用了jQuery，但從未引用過它，因此您的腳本將無法工作。 如果要使用jQuery，請確保還添加了它：

<script src="<%= Url.Content("~/Scripts/jquery-1.8.2.js") %>"></script>
<script src="<%= Url.Content("~/Scripts/TestPage.js") %>"></script>

或者如果您不想使用jQuery修復腳本，以使其不依賴於它：

function dosomething() {
    alert('snuh');
}

window.onload = function() {
    document.getElementById('foo').onclick = dosomething;
};

或者，如果您將腳本放在DOM的末尾，您甚至不需要將其包裝在文檔就緒處理程序中，因為在此階段，DOM已准備就緒，您可以對其進行操作：

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <meta name="viewport" content="width=device-width" />
    <title></title>
</head>
<body>
    <div>
        <input id="foo" value="snuh" />
    </div>
    <script src="<%= Url.Content("~/Scripts/TestPage.js") %>"></script>
</body>
</html>

然后在腳本中：

function dosomething() {
    alert('snuh');
}
document.getElementById('foo').onclick = dosomething;

簡潔的JavaScript-找不到單獨的JS文件

問題描述

1 個解決方案

解決方案1
1 已采納 2013-02-26 16:36:18

簡潔的JavaScript-找不到單獨的JS文件

問題描述

1 個解決方案

解決方案1 1 已采納 2013-02-26 16:36:18

解決方案1
1 已采納 2013-02-26 16:36:18