Question

我想知道如何使Jquery库工作。在问这个问题之前，我当然有研究这个问题，我有一本书建议做以下事情：

<script src="scripts/jquery-1.6.2.min.js"><script>

然而，出于某种原因，即使这样，我页面上的内容也不会响应我的代码。所以我很困惑。我尝试的是，将我正在处理的文件移动到与jquery-1.6.2.min.js相同的目录，因为jquery是一个js库，但没有用。我想知道它会是什么？我已经搜索了疯狂的语法错误，所以我真的很怀疑这个问题。我想知道我做错了什么？我能想到的唯一其他选择是使用网站标签（我已尝试过）：

<head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>

或

<head>
  <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery- 1.6.2.min.js"></script>
</head>

我想避免，因为我不想在工作时依赖网络，我们永远都不知道......谢谢！

顺便说一句，这是完整的代码：

<!DOCTYPE html>
<html>
  <head>
    <title>jQuery goes to DOM-ville</title>
    <style>
      #change_me {
        position: absolute;
        top: 100px;
        left: 400px;
        font: 24px arial;
      }
      #move_up #move_down #color #disappear { padding: 5px; }
    </style>
    <script src="scripts/jquery-1.6.2.min.js"></script>
  </head>
  <body>
    <button id="move_up">Move Up</button>
    <button id="move_down">Move Down</button>
    <button id="color">Change Color</button>
    <button id="disappear">Disappear/Re-appear</button>
    <div id="change_me">Make Me Do Stuff!</div>
    <script>
      $(document).ready(function() {
        $("#move_up").click( function() {
          $("#change_me").animate({top:30},200);
        });//end move_up
        $("#move_down").click( function() {
          $("#chage_me").animate({top:500},2000);
        });//end move_down
        $("#color").click( function() {
          $("#change_me").css("color", "purple");
        });//end color
        $("disappear").click( function(){
          $("#change_me").toggle("slow");
        });//end disappear
      });//end doc ready
    </script>
  </body>
</html>

Answer 1

问题很可能是路径......你刚才使用HTML页面吗？如果是这样，有几点需要注意：

1。）当路径以/开头时，意味着它从根文件夹开始。

2。）当路径不以/开头时，意味着它将相对于它所在的当前文件夹开始。

修复：

在你的html文件夹中，创建一个javascripts文件夹（你可以调用它，例如“js”），并将你的jquery javascript文件放在其中。

然后将其用作jquery的路径：

 <script type="text/javascript" src="/javascripts/jquery.min.js"

这将引用绝对路径，因此如果以后，您在嵌套文件夹中有html文件，它将不会查看相对路径而是绝对路径。

如果你想在互联网上使用谷歌版本，如果你不想使用本地版本，你也可以使用这个片段：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>  
<script type="text/javascript">
    window.jQuery || document.write("<script src='/PATH/TO/jquery.js'><\/script>")
</script>

附录：

修正帖子以反映FabrícioMatté修正。

如果你没有在网络服务器（例如apache）后面运行，那么绝对路径会变得有点时髦。这就是为什么它可以在服务器上运行，而不是在您的计算机上运行。

如果您在本地运行它，没有网络服务器（不要这样做，安装MAMP或XAMP，Apache，nginx，IIS，等等......），您需要指定完整路径：

的Mac： /Users/yourusername/Sites/website/index.html

PC： C：/somethign/something/else/index.html

Answer 2

您是否将您的页面（您复制了所有代码并向我们展示的那个）放在与名为“scripts”的目录相同的目录中？在那个“scripts”目录中，你有一个名为“jquery-1.6.2.min.js”的文件吗？

我的猜测是发生的三件事之一：

您的jquery文件位于不同的目录中
您从未包含jquery文件
jquery文件名不是完全相同的

如果你签入FireBug，我敢打赌这个文件丢失了

使Jquery库工作的不同替代方案

2 个答案: