Question

我可以在我的HTML中创建一个jQuery函数没问题：

<body>

<input type="text" id="mainInput" />
<button class="btn" id="mainButton"></button>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script>
    $(document).ready(function () {
        $("#mainButton").click(function () {
            $("#mainInput").hide("slow");
        });
    });
</script>

</body>

这正是我打算做的事情。

我认为创建一个包含实际函数的单独脚本是个好主意，所以我把脚本放在自己的文件中......

<body>

    <input type="text" id="mainInput" />
    <button class="btn" id="mainButton"></button>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <script src="~/js/jQueryPractice.js"></script>

</body>

这是带有jQuery的.js文件

$(document).ready(function () {
    $("#mainButton").click(function () {            
        $("#mainInput").hide("slow");
    });
});

一旦我这样做，功能就不再起作用了。从我研究的所有内容来看，这应该按预期工作;我已经阅读了多个使用此方法的教程。我一定错过了一些简单的事情......

Answer 1

此路径：

src="~/js/jQueryPractice.js"

使用~，这对浏览器没有任何意义。你期望引用什么URL？它应该是服务器的根吗？：

src="/js/jQueryPractice.js"

相对于页面？：

src="./js/jQueryPractice.js"

还有别的吗？

无论脚本的URL是相对的还是绝对的，都需要在src属性中使用。

Answer 2

这就是它的工作原理。

我的项目有一个＆＃39; wwwroot＆＃39;目录。它是在通过Visual Studio生成新的ASP.NET Core应用程序时包含的。

里面有一个js文件夹。当我把脚本放在那里时，浏览器开始成功找到它。

这是HTML：

<script src="~/js/jQueryPractice.js"></script>

＆＃39;〜＆＃39;似乎是指＆＃39; wwwroot＆＃39;。该脚本现在正在引用并按预期运行。

无法在HTML中引用jQuery .js文件

2 个答案: