-2

这段代码可以完美地在 jsfiddle 中执行我想要的操作，但是在我的本地文件（即 index.html、index.css、index.js）上执行此操作时无法复制它。有人可以概述一下我如何使其在本地工作而不仅仅是在 jsfiddle 上工作吗？这是 jsfiddle：http: //jsfiddle.net/Naush/Cr7GK/

这是我认为它应该看起来的样子：

html:

<html>

<head>

    <link type="text/css" rel="stylesheet" href="css/index.css"/>

    <script type="text/javascript" src="js/index.js"></script>
</head>
<body>

<div class="black"></div>
<div class="orange"></div>

</body>
</html>

CSS：

.black {
    position:absolute;
    height:100px;
    width:200px;
    background-color:gray;
}
.orange {
    display:none;
    position:absolute;
    height:100px;
    width:100px;
    background-color:orange;
    left:200px;
}

javascript:

$(document).ready(function () {
    $(".black").hover(function () {
        $(".orange").toggle();
    })
})

我有一种强烈的感觉，我没有在 html 头标签中正确包含某些内容。文件路径是正确的，我已经仔细检查了。任何帮助将不胜感激！

4

7 回答 7

2

错误，您必须包含 Jquery 库 src，是吗？

http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js

于 2013-05-25T07:13:50.877 回答
2

看来您没有在您的<head>- JSfiddle 中链接到 jQuery，但您必须自己正常进行。

把它包含在你里面<head>

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>

这是一个工作版本http://fotest.co.nf/

于 2013-05-25T07:13:53.337 回答
2

你没有导入 jquery lib

于 2013-05-25T07:14:28.080 回答
1

我认为你得到 $ is not defined 错误。所以你必须添加 jquery 插件才能使用 jquery 方法。

于 2013-05-25T07:20:47.797 回答
1

我建议您删除语法错误，例如

$(document).ready(function () {
    $(".black").hover(function () {
        $(".orange").toggle();
    });
});

并检查你是否添加了js文件，是否加载了它，如果没有添加尝试在标题处添加

<link type='text/javascript' href='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' />
于 2013-05-25T07:12:11.537 回答
1

你有没有添加 jquery 1.9.1.js ？

如果没有，请添加。

http://code.jquery.com/jquery-1.9.1.js

于 2013-05-25T07:13:21.890 回答
1

我没有看到你包括 jquery 脚本

<script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
于 2013-05-25T07:14:50.823 回答