为什么我的jQuery脚本无法加载？
[英]Why won't my jQuery script load?
问题描述
我刚开始使用HTML / CSS / jQuery，并尝试过从入门开始。 目前，我有一个.html，.css和.js。 我的index.html将加载.css，但不会加载.js。 我的代码有问题吗？
的HTML
<!DOCTYPE html>
<html>
<head>
<title>Super Mario!</title>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<img src="http://i1061.photobucket.com/albums/t480/ericqweinstein/mario.jpg"/>
</body>
</html>
的CSS
img {
position: relative;
left: 100px;
top: 100px;
}
jQuery查询
$(document).ready(function() {
$(document).keydown(function(key) {
switch(parseInt(key.which,10)) {
case 65:
$('img').animate({left: "-=10px"}, 'fast');
break;
case 83:
$('img').animate({top: "+=10px"}, 'fast');
break;
case 87:
$('img').animate({top: "-=10px"}, 'fast');
break;
case 68:
$('img').animate({left: "+=10px"}, 'fast');
break;
default:
break;
}
});
});
请帮我弄清楚为什么这行不通。 一些其他信息，它们都位于我的桌面上的同一文件夹中。 没有子文件夹。
4 个解决方案
解决方案1
6 2013-05-17 07:04:21
您正在JavaScript文件中使用jQuery代码，但HTML中不包含jquery Lib。
在加载脚本之前，添加以下行（或者您可以用指向托管的jQuery库的另一个链接来替代）（假设您使用的是当前jQuery版本-否则包括适当的版本）：
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
因此，您的<head>应该如下所示：
<!-- some code -->
<head>
<title>Super Mario!</title>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<!-- some code -->
解决方案2
1 2013-05-17 07:04:46
您不包括jQuery库。 包括在你的脑海：
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
解决方案3
0 2013-05-17 07:07:27
从任何CDN添加jquery
<head>
<title>Super Mario!</title>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
解决方案4
0 2015-11-05 17:38:53
您的jQuery脚本未加载，因为您没有在JavaScript文件中的脚本之前添加jQuery库。 其他答案很好，但我想扩展一下，可以使用各种外部托管库中的jQuery。 您可以使用所需的任何版本，只要它与您正在执行的操作兼容即可。
我个人使用CDNJS ，该CDNJS托管许多有用的javascript库。 您可以访问他们的网站并找到jQuery，然后选择所需的版本
选择所需的版本后，将显示复制链接的选项，并将其放入src
您可以将其放在<head>或结束</body>
例子1
<head>
<!-- meta tags and CSS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
例子2
<!-- other HTML and content -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
还有一点非常重要，请注意，如果添加任何其他jQuery插件或库，则应在jQuery之后但自定义JS文件之前添加它。 不要使用库编辑文件，而是添加另一个文件，该文件可以是您的custom.js ， main.js或任何您想调用的文件。
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="someplugin.js"></script>
<script type="text/javascript" src="script.js"></script>
为什么jQuery的加载事件不会触发动态插入的脚本元素？
[英]Why won't jQuery's load event fire on dynamically inserted script elements?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.