Question

我一直在使用以下代码来检查div是否可见：

if ($("#monday").is(':visible')) {
    document.getElementById('scheduleitem1').style.width = 540;
    $("#scheduleitem1").show();                     
}

该代码运行良好。但是我想检查一次是否可以看到多个div中的一个。

我尝试过以下不起作用的代码：

if ($("#monday" || "#tuesday").is(':visible')) {
    document.getElementById('scheduleitem1').style.width = 540;
    $("#scheduleitem1").show();                     
}

和

if ($("#monday", "#tuesday").is(':visible')) {
    document.getElementById('scheduleitem1').style.width = 540;
    $("#scheduleitem1").show();                     
}

那么，如果我想检查一次是否可以看到多个div中的一个，我该怎么办？

Answer 1

试试这个：

$("#monday,#tuesday").is(':visible')

http://api.jquery.com/is/：“...如果这些元素中至少有一个与给定的参数匹配，则返回true”。

Answer 2

检查所选元素的长度$("#monday,#tuesday").find(":visible").length == 1

像

这样的东西

if ($("#monday,#tuesday").find(":visible").length == 1) {
    document.getElementById('scheduleitem1').style.width = 540;
    $("#scheduleitem1").show();                     
}

Answer 3

试试这个：

if ($("#monday").is(':visible')  || $("#tuesday").is(':visible')) {
    $("#scheduleitem1").css('width', '540px').show();                     
}

我会在所有工作日添加一个包装器并执行以下操作：

if($("#weekDays").find('div:visible')) {
    $("#scheduleitem1").css('width', '540px').show();                     
}

Answer 4

我知道这个问题表明只有一个元素必须可见。这个答案适用于想要检查所有元素是否可见的未来访问者。

// Assume that the elements are visible
var is_visible = true;
// Select the elements wanted and go through each of them one by one
$("#monday, #tuesday, #etc").each(function() {
  // Check that the assumption is true for each element selected
  if (!$(this).is(':visible')) {
    is_visible = false;
  }
});
if (is_visible) {
    $("#scheduleitem1").width(540).show();                     
}

更新，简洁起见：

// Check if the elements are not hidden.
if (!$("#monday, #tuesday, #etc").is(':hidden')) {
    $("#scheduleitem1").width(540).show();                     
}

检查一次是否可以看到多个div

4 个答案: