Question

我无法让jQuery在我的页面上工作。所以我用jsfiddle.net来测试我的jQuery代码是否有效，而且确实如此。但是，当我将相同的代码复制并粘贴到我的文档时，它不起作用。所以我假设在我的html文档上链接jQuery外部文件时出错。我正在使用TextWrangler作为我的文本编辑器。

HTML

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title> Rules </title>
    <link rel="stylesheet" href="styleRules.css"  />
    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
    <script type= "text/javascript"  src="JsRules.js"> </script>
</head>
<div id="left" >
    <ol>
        <li> First Rule </li>
    </ol>
</div>

CSS

#left {
    float:left;
    margin-left:200px;
}

的jQuery

$(document).ready(function () {
    $("#left").mouseenter(function () {
    $("#left").fadeTo("fast", 0.25); });
});

感谢您有时间回答和阅读本文。我现在卡住了，我已经走到了尽头，我迫不及待想要解决这个问题！

Answer 1

我同意其他人的看法，这很可能是jQuery文件名称中的拼写错误。我使用您的确切代码创建了一个网页，除了我拼写正确的jquery文件。它工作正常。

即使使用BODY元素是正确和重要的，它也不会影响我测试代码的结果。

Answer 2

请使用“Inspect Element”（Chrome工具）或Firebug（Firefox和Chrome工具）查找错误。

现在对我来说可能的错误是：

例如<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
您可以使用外部文件更改脚本（libraries of google）<script src="http://code.jquery.com/jquery-2.0.0.js"></script>

现在我用你的代码在JSFIDDLE上创建DEMO，看起来它可以正常工作

Answer 3

您的HTML中引用了jQuery文档中的拼写错误：

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title> Rules </title>
  <link rel="stylesheet" href="styleRules.css"  />
<!---Typo was here--->
  <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> 
  <script type= "text/javascript"  src="JsRules.js"> </script>
</head>
<div id="left" >
        <ol>
            <li> First Rule </li>
        </ol>
</div>
</body>

为什么我的jQuery根本不工作？

3 个答案: