jquery css函数不能用于检测显示/隐藏的元素
jquery css函数不能用于检测显示/隐藏的元素
提问于 2013-07-23 21:09:07
我的代码：
<script type="text/javascript">
$(function(){
$("body").click(function(){
$("ul").toggle("slow");
var b = $("ul").css("display");
console.log("ul display :"+b);// unfortunately,always returns block!
});
});
</script>
</head>
<body>
<nav>
<ul>
<li><a href="/">home</a></li>
<li><a href="/archive/">Archive</a></li>
<li><a href="/about/">About</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
</body>
</html>我使用jquery toggle()函数来显示/隐藏。但是toggle()不会改变CSS值，所以你不能使用.css("display")函数来检查块元素的状态是隐藏的，.css("display")总是返回“display.Even”，如果你的原始css表单定义了"display:block;“。
如何检测元素是否显示或隐藏的显示状态？或者，你知道改变真实显示值的方法吗?这是切换()不能实现的。
注意:您不能使用下面所示的方法，因为前面的代码是测试代码，而在实际代码中，toggle()和.css("display")在不同的函数中，并且在完全不同的时间执行。
$("ul").toggle("slow", function() {
...
}回答 2
Stack Overflow用户
发布于 2013-07-23 21:15:02
我认为这里的主要问题是，在检查状态时，代码不会等待动画完成，因此它在运行时实际上仍然可见。
如果在动画完成后检查状态(在回调函数中)，它会正确地返回none
$("body").click(function(){
$("ul").toggle("slow", function() {
var b = $("ul").css("display");
console.log("ul display :"+b); // This will return none
});
var b = $("ul").css("display");
console.log("ul display :"+b); // This will return block
});此示例将在隐藏element - http://jsfiddle.net/Vw9nA/后立即显示block，然后显示none
但正如评论和其他链接问题中所述，检查可见性的最佳方法是$('ul').is(':visible')
Stack Overflow用户
发布于 2013-07-23 21:17:29
$(function(){
$("body").click(function(){
$("ul").toggle("slow",function(){
console.log($(this).css('display')); //none
});
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17811129
复制相关文章
相似问题
腾讯云开发者
