我正在尝试做一个简单的jQuery教程,但它不起作用。
<html>
<head>
<title></title>
<script type="text/javascript" src="jquery-1.3.2.js">
$(function() {
$('a').click(function() {
$('#box').fadeOut();
});
});
</script>
<style type="text/css">
#box
{ background: red;
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<div id="box" ></div>
<a href="#">Click Me</a>
</body>
</html>
我复制并粘贴了jquery文件名:jquery-1.3.2
我看不出有什么问题?我正在使用Firefox。
答案 0 :(得分:15)
将您的点击事件代码放在不同的脚本块中。
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
$('a').click(function() {
$('#box').fadeOut();
});
});
</script>
您提交的错误让我记得Degrading Script Tags
引用外部资源的脚本标记(通过src属性)不再能够执行标记本身嵌入的脚本。
答案 1 :(得分:9)
首先,确保目录中有jquery-1.3.2.js
。
然后,更改脚本标记:
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a').click(function() {
$('#box').fadeOut();
});
});
</script>
答案 2 :(得分:3)
您需要非常小心地将代码的不同部分放在哪里才能工作。
看一下对我有用的代码。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Fade Out Red Box</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#box
{
background: red;
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<div id="box"></div>
<a href="#">Click me</a>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("a").click(function() {
$("#box").fadeOut("slow");
});
});
</script>
</body>
</html>