我想让#test元素显示: block ；单击#button 元素后。 如果我再次单击，我希望 #test 元素显示:none;。
<body>
<div id="content-wrapper">
<!-- header -->
<header id="top">
<!--- Nav-bar -->
<div id="button">
</div>
</header>
<div id="test">
这是我的 jQuery 代码:
$(function() {
$('#button').on('click', function () {
if ($('#test').css("display","block")) {
$('#test').css("display","none");
} else {
$('#test').css("display","block");
}
});
});
我不知道为什么它不起作用!
最佳答案
.toggle() 没问题 - 但使用 css 类会给你更好的控制(比如将来使用 CSS 转换)(停止内联样式，但做同样的工作)
CSS
#test { display:none; }
#text.on { display:block; }
JS/JQUERY
$('#button').on('click', function () {
$('#test').toggleClass('on');
});
关于javascript - 我的 JQuery 函数出了什么问题？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22282611/