通过 CSS,我将所有 div 设置为 visibility :hidden
。通过单击导航栏中的元素,我希望将目标 div 设置为 visibility :visible
。这工作得很好,但如果它已经可见,我想避免再次设置它。
此代码无效
function showNewElement(actID) {
ID = actID.substring(1, actID.length);
$('.mainDiv:visible').css("visibility", "hidden");
$("#" + ID + ':hidden').css("visibility", "visible").hide().fadeIn('fast');
}
所以我不得不将它包装在一个 if 语句中
function showNewElement(actID) {
var ID = actID.substring(1, actID.length);
if ($("#" + ID).css("visibility") != "visible") {
$('.mainDiv').css("visibility", "hidden");
$("#" + ID).css("visibility", "visible").hide().fadeIn('fast');
}
}
为什么反过来不行?
最佳答案
Elements are considered visible if they consume space in the document.
Elements with visibility: hidden or opacity: 0 are considered visible, since they still consume space in the layout.
因此,虽然您看不到这些元素,但它们不在 :visible
集合中。
您可以改为在 mainDiv
元素上使用 display: none
。那么就会认为是不可见的
.mainDiv {
display: none;
}
然后将 jQuery 更改为
function showNewElement(actID) {
ID = actID.substring(1, actID.length);
$('.mainDiv:visible').hide();
$("#" + ID + ':hidden').fadeIn();
}
参见修改后的 JSFiddle
关于jquery - 通过 ID 和 CSS 属性选择元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20323592/