如何使用 . hide () 、.show () 或.toggle () 来切换元素的可见度 ?
如果元素可见或隐藏, 我如何测试 ?
当前回答
您需要检查... 显示和可见度 :
if ($(this).css("display") == "none" || $(this).css("visibility") == "hidden") {
// The element is not visible
} else {
// The element is visible
}
如果我们自动检查$( thiss) 。 is (“: 可见”) , jquery check for both the things 自动检查 。
其他回答
公平而言,问题早于这一答复的日期。
而不是批评行动, 而是帮助所有仍在问这个问题的人。
确定是否可见事物的正确方式是咨询你的视觉模型;
如果你不知道这意味着什么 那你就要踏上 探索之旅 这将使你的工作变得不那么困难
以下是模型视图模型结构概览(mvvm)。
knockoutjs 是一个具有约束力的图书馆, 它能让您在不学习整个框架的情况下尝试这些 。
这里有一些刺绣代码 和可能看不到的迪夫。
<html>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script>
<script>
var vm = {
IsDivVisible: ko.observable(true);
}
vm.toggle = function(data, event) {
// Get current visibility state for the div
var x = IsDivVisible();
// Set it to the opposite
IsDivVisible(!x);
}
ko.applyBinding(vm);
</script>
<div data-bind="visible: IsDivVisible">Peekaboo!</div>
<button data-bind="click: toggle">Toggle the div's visibility</button>
</body>
</html>
注意, 切换函数不咨询 dom 以决定 div 的可见度; 它会查询视图模型 。
您应该考虑的另一个答案是,如果您正在隐藏一个元素, 您应该使用jquery, 而不是实际上隐藏它, 而是删除整个元素, 但是您将其 html 内容和标签本身复制为 jquery 变量, 然后您需要做的就是测试屏幕上是否有这样的标签, 使用正常的 $ (“ tagname ”) 时间长度 。
可以创建函数以检查可见度/显示属性,以测量元素是否显示在 ui 中。
function checkUIElementVisible(element) {
return ((element.css('display') !== 'none') && (element.css('visibility') !== 'hidden'));
}
工作小儿
.is(":not(':hidden')") /*if shown*/
这对我来说是有效的,我用表演和隐藏来使我的 div 隐藏/可见:
if( $(this).css('display') == 'none' ){
/* your code goes here */
} else {
/* alternate logic */
}
