尝试将类切换为可见/隐藏，但文本再次出现，没有看到任何控制台错误
尝试将类切换为可见/隐藏，但文本再次出现，没有看到任何控制台错误
提问于 2012-05-27 04:11:39
我在试着用一个链接来隐藏按钮。它们消失了，但立即又出现了。
一旦它们可以保持显示状态，我将为show/hide链接编写更多的代码来显示隐藏的"show me“。
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$('#small-text').hover (function() { $('body').removeClass().addClass('small-text'); })
$('#large-text').hover (function() { $('body').removeClass().addClass('large-text'); })
$('#button-selector').click (function() { $('#buttons').toggleClass('hidden'); })
});
</script>
<style>
ul {background:yellow}
li {background:green}
.small-text {font-size: small}
.large-text {font-size: large}
#buttons.hidden {display: none}
#buttons.shown {display: normal}
</style>
</head>
<body>
<ul>
<li>AAA-22222</li>
<li>BBB-33333</li>
<li>CCC-44444</li>
</ul>
<div id="buutton_toggle"><a href="" id="button-selector">hide buttons</a></div>
<div id="buttons">
<button id="small-text">Small</button>
<button id="large-text">Large</button>
</div>
</body>个人作业(学习js / js)
回答 2
Stack Overflow用户
发布于 2012-05-27 04:17:20
页面可能正在重新加载，因为这是一个具有空href的<a>元素，请尝试阻止默认操作，如下所示：
$(document).ready(function(){
$('#small-text').hover (function() { $('body').removeClass().addClass('small-text'); });
$('#large-text').hover (function() { $('body').removeClass().addClass('large-text'); });
$('#button-selector').click(function(e) {
e.preventDefault();
$('#buttons').toggleClass('hidden');
});
});Stack Overflow用户
发布于 2012-05-27 04:21:24
您还可以像这样快速修复：
<a href="#" id="button-selector">hide buttons</a>注意href部分中的"#" ...
这是JSFiddle：http://jsfiddle.net/leniel/YpSKu/1/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/10769414
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号