Question

所以我正在尝试运行这个基本的jQuery代码。问题是，无论何时我尝试运行它（我使用谷歌chrome btw）它似乎似乎没有加载jQuery或东西。我不知道这是CDN还是我的代码中缺少的简单内容。所以你能尝试看看我不能做的事情吗？

<!doctype html>
<html>
<title>Hover</title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.js">
</script>
<style type="text/css">
.box {
margin: 10px;
padding: 20px;
width: 50px;
border: 1px solid black
}`
.colorBox {
background-color: red;
}
</style>
<body>
<h1>Hover</h1>
<hr>
<br />
<br />`
<span class="box">box 1</span>
<span class="box">box 2</span>
<span class="box">box 3</span>
<script type="text/javascript">
$(document).ready(function() {
$(".box").hover(function() {
// box changes color once it's getting hovered over //
$(this).addClass("colorBox);
},
function() {
// box goes back to the default color once it leaves the box //
$(this).removeClass("colorBox);
});
});
</script>
</body>
</html>

Answer 1

你忘记关闭引用了：

$(this).addClass("colorBox);

应该是

$(this).addClass("colorBox");

如果您使用的是良好的文本编辑器，语法突出显示应该会在您遇到此类问题时给出提示。在javascript控制台中也很明显，它会引发语法错误异常。

jQuery似乎不起作用

1 个答案: