我知道有与我遇到的类似问题，但我尝试了不同的解决方案（至少我认为），但没有任何效果。因此，我在 JS 文件中编写了 JQuery 代码，但是当我将 js 和 jq 版本的路径放入 HTML 文件中时，它在我的任何一个 Web 浏览器中都不起作用，但是当我将 JQuery 代码直接放入 HTML 中时，它就可以工作。我多次检查代码，寻找打字错误，但没有找到任何东西。也许我没有看到一些明显的东西，所以请告诉我。这是我第一次接触这个所以...谢谢$(document).ready(function() { $(".collapse-control").click(function() { $(".collapse-box").slideUp(); $(this).closest(".collapse").find(".collapse-box").slideDown(); });});<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Lesson</title> <meta name="viewport" content="width=vice-width, initial-scale=1"> <meta name="author" content="Unknown"> <meta name="description" content="description"> <meta name="keywords" content="web,html,css,html5,development"> <script src="js/script.js"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script></head><body> <div class="collapse"> <h2 class="collapse-control">Open box 1</h2> <div class="collapse-box"> This is box 1 </div> </div></body></html>
3 回答
小唯快跑啊
TA贡献1863条经验 获得超2个赞
您的文件应该在 html 文件中调用库script.js之后调用。jquery
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="js/script.js"></script>
$(document).ready(function() {
$(".collapse-control").click(function() {
$(".collapse-box").slideUp();
$(this).closest(".collapse").find(".collapse-box").slideDown();
});
});
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Lesson</title>
<meta name="viewport" content="width=vice-width, initial-scale=1">
<meta name="author" content="Unknown">
<meta name="description" content="description">
<meta name="keywords" content="web,html,css,html5,development">
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="js/script.js"></script>
</head>
<body>
<div class="collapse">
<h2 class="collapse-control">Open box 1</h2>
<div class="collapse-box">
This is box 1
</div>
</div>
</body>
</html>
海绵宝宝撒
TA贡献1809条经验 获得超8个赞
当您在包含脚本后包含 jQuery 时，这是没有意义的。
您应该在包含 jQuery 之后包含您的脚本。
所以你的代码将是这样的：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Lesson</title>
<meta name="viewport" content="width=vice-width, initial-scale=1">
<meta name="author" content="Unknown">
<meta name="description" content="description">
<meta name="keywords" content="web,html,css,html5,development">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="js/script.js"></script>
</head>
<body>
<div class="collapse">
<h2 class="collapse-control">Open box 1</h2>
<div class="collapse-box">
This is box 1
</div>
</div>
</body>
</html>
神不在的星期二
TA贡献1963条经验 获得超6个赞
尝试使用：
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="js/script.js"></script>
已安装：
<script src="js/script.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
希望能帮助到你。
- 3 回答
- 0 关注
- 124 浏览
添加回答
举报
0/150
提交
取消