-1

我有几个连接的外部文件。我尝试使用简单列出文件名称的快捷方式（所有文件都在同一个文件夹中），但只有 CSS 文件“有效”或“连接”或其他什么，所以我现在使用 SHIFT + RMB 来“复制为小路。” 我正在 Notepad++ 中编辑文件，并在 64 位 Windows 7 Home Premium 上的 Google Chrome 中打开文件（如果有区别的话）。

HTML 代码：

<html>

<head>
<link rel = "stylesheet" type = "text/css" href = "No Real Purpose.css"/>

<title>Random text</title>
</head>

<body>
<div id = "clickToHide">
Hide div
</div>

<div id = "hidable">
hidden?
</div>

<!--Script inclusion-->
<script type = "text/javascript" src = "C:\Program Files (x86)\EasyPHP5.2.10\www\JQuery Test\No Real Purpose.js"></script>
<script type = "text/javascript" src = "C:\Program Files (x86)\EasyPHP5.2.10\www\JQueryTest\jQuery.js"></script>
</body>
</html>

CSS 代码：

div
{
     color: white;
     background-color: black;
     box-shadow: 2px 2px black;
     height: 100px;
     width: 100px;
     padding: 3px;
     margin: 5px;
}

#hidable
{
    color: black;
    background-color: yellow;
    box-shadow: 2px 2px black;
    height: 100px;
    width: 100px;
    padding: 3px;
    margin: 5px;
}

jQuery代码：

$(document).ready(function()
{
    $('clickToHide').click(function()
    {
        $('#hidable').slideToggle('fast');
    });
});

我哪里出错了？

编辑：这些不是在线发布的，它们是本地存储在我的计算机上的。我只是想测试我对 jQuery 的了解。没有服务器！

4

7 回答 7

2 
use this to load jquery 

<script     type="text/javascript"src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
于 2013-01-02T17:51:18.530 回答
1

除了在“clickToHide”的 click() 事件中缺少“#”之外，您还使用了 Windows 样式的路径格式，这是行不通的。

将您的引用更改C:\...为类似/JQueryTest/NoRealPurpose.js（前导“/”是您的网络根目录）。

避免在文件名中使用空格也很好。当您从开发环境转到生产环境时，拥有空间会混淆 Web 服务器并导致意外问题。

于 2013-01-02T17:46:33.177 回答
1

尝试在 html 的 head 部分中包含 JavaScript 文件。此外，使用相对路径而不是绝对路径：当您使用 EasyPHP 或 xampp 等平台时，通常可以通过在 Web 浏览器栏中输入“http://localhost”来访问本地服务器。

在这种情况下，您将通过输入“localhost/JQueryTest/”打开您的文档（我假设您的 html 文档放在该文件夹中，还请注意，每个 JavaScript 文件都有不同的路径，一个读取 \JQueryTest\ 而另一个读取有一个空格），相对路径将只是“jQuery.js”。

更新：另外，正如其他人所指出的，尽可能避免使用空格并检查您的 jQuery 语法。判断是否加载 jQuery 的快速方法是：

$(document).ready( function(){
    alert("Hey cruel world!");
});
于 2013-01-02T17:47:56.670 回答
1

我认为你的问题是这样的：

如果您的JQueryTest文件夹位于根目录，那么这应该可以。

<script type="text/javascript" src="/JQueryTest/jQuery.js"></script>
<script type="text/javascript" src="/JQueryTest/No Real Purpose.js"></script>
                           //--------^^^^^^^^^^------Your folder reference

这里的顺序很重要 jquery 应该在你的doc ready调用脚本之前加载。

于 2013-01-02T17:53:01.343 回答
1 
$('clickToHide').click(function()

你之前没有放 a #，clickToHide所以 jQuery 认为你正在寻找一个名为 clickToHide 的元素，将 a 插入#( #clickToHide) 并查看它是否有效。

编辑：另外，尽量避免文件名中的空格，这可能会或可能不重要，但这是不好的做法，如果可以的话，你应该避免它。No Real Purpose.css可能成为NoRealPurpose.css

于 2013-01-02T17:42:38.437 回答
1

是错字还是漏掉了#

$(document).ready(function()
{
    $('clickToHide').click(function()
------^ here?
    {
        $('#hidable').slideToggle('fast');
    });
});
于 2013-01-02T17:44:01.297 回答
1

您应该使用服务器的相对或绝对路径（EasyPHP 模拟 Apache 服务器），而不是计算机的本地路径：

<script type="text/javascript" src="No_Real_Purpose.js"></script>
<script type="text/javascript" src="jQuery.js"></script>
于 2013-01-02T17:46:15.007 回答