Question

所以我一直在浏览HTML / CSS和Jquery上的一些codeacademy内容。

尝试让我的代码在本地计算机外部工作时遇到一些麻烦。

这是我的HTML

<!DOCTYPE html>
<html>
    <head>
        <title>Krypton Redux</title>
        <link rel='stylesheet' type='text/css' href='stylesheet.css'/>
        <script type='text/javascript' src='script.js'></script>
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>    </head>

    <body>

        <div></div>
        <div style = "margin:10"></div>
        <div></div>
    </body>
</html>

这是我的jQuery

$(document).ready(function(){
    $('div').draggable();
});

当我直接在我的HTML文件中编写jQuery代码然后在Chrome中打开它时，它可以工作。但是，当在.js文件中执行此操作时，我收到错误消息，指出'$'无法识别。任何人都知道为什么？

Answer 1

在script.js脚本下方添加jQuery。

<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type='text/javascript' src='script.js'></script>

Answer 2

$是jQuery别名。如果您在脚本中使用$，则必须在脚本之前定义jQuery。这是一个简单的修复。像这样重新排列脚本链接：

<!-- Load jQuery first -->
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<!-- Since you use jQuery UI in your script as well, load it second. -->
<!-- Note however that jQuery Core must be included before UI because it's a dependency -->
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<!-- Finally, load your script -->
<script type='text/javascript' src='script.js'></script>

希望这有帮助。

链接script.js和html5

2 个答案: