我试图掌握 click() 和 toggle() 方法,但是当我尝试实现它们时,它似乎是从我的页面“剥离”已单击的类并运行代码。因为原始类已从我的页面上剥离,所以我无法再次单击 () 来切换 () 它。
知道我做错了什么吗?我查了很多次并尝试了各种示例代码,所有这些代码似乎都给我同样的“剥离”效果,因为它似乎将我的类从页面上剥离到左侧。还有各种情况我需要使用 ID,这就是我不能使用 addClass() removeClass() 方法的原因。
这是我的代码(我留下了 CSS,因为当有背景而不仅仅是文本时更容易看到我所指的“剥离”效果):
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
<head>
<title>Header</title>
<style>
body {
background: black;
color: white;
}
div {
background: blue;
}
.adventure{
position: absolute;
top: 22px;
left: 0px;
}
.solarSystem{
position: absolute;
top: 44px;
left: 0px;
}
</style>
</head>
<body>
<div class="adventure">Choose Own Adventure</div>
<div class="solarSystem">Solar System</div>
</body>
<script>
$(".adventure").click(
function(){
$('.adventure').toggle(function () {
$(".solarSystem").css({top: "150px"});
}, function () {
$(".solarSystem").css({top: "250px"});
});
});
</script>
</body>
</html>
非常感谢任何帮助,因为我花了太长时间来解决这个问题而没有运气。 :( 谢谢!
最佳答案
将 toggle()
函数放在 click()
函数中可能不会按照您的想法执行,而那个版本的 toggle()
也在较新版本的 jQuery 中被删除
您可以创建自己的切换功能
$(".adventure").on('click', function(){
var flag = $(this).data('flag');
$(".solarSystem").css({top: (flag ? "250px" : "150px")});
$(this).data('flag', !flag);
});
关于javascript - Click() 和 Toggle() - 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22362891/