Как проверить, нет ли видимого состояния div?

У меня есть табуляции, подобные этому.

<li id="singlechatpanel-1" style="visibility: hidden;">
     //content
</li>

Попытка проверить его так:

$(".subpanel a").click(function() 
     {
        var chatterNickname = $(this).text();

        if(!$("#singlechatpanel-1").is(':visible'))
        {
            alert("Room 1 is filled.");
            $("#singlechatpanel-1").css({'visibility':'visible'});
            $("#singlechatpanel-1 #chatter_nickname").html("Chatting with: " + chatterNickname);
        }

Если условие всегда возвращает false. Как проверить состояние видимости этого div?

Ответы

Ответ 1

is(':visible') проверяет свойство display элемента, вы можете использовать метод css.

if (!$("#singlechatpanel-1").css('visibility') === 'hidden') {
   // ...
}

Если вы устанавливаете свойство display элемента в none, то ваш оператор if возвращает true.

Ответ 2

Проверьте, видимо ли это.

$("#singlechatpanel-1").is(':visible');

Проверьте, не скрыта ли она.

$("#singlechatpanel-1").is(':hidden');

Ответ 3

если элемент скрыт jquery, затем используйте

if($("#elmentid").is(':hidden'))

Ответ 4

Вы можете использовать .css(), чтобы получить значение "видимость":

 if( !$("#singlechatpanel-1").css('visibility') === "hidden"){}

http://api.jquery.com/css/

Ответ 5

Вы можете использовать метод (': hidden'), чтобы узнать, отображается ли ваш div или нет. Также его хорошая практика кэширования элемента, если вы используете его несколько раз в своем коде.

$(".subpanel a").click(function() 
     {
        var chatterNickname = $(this).text();
        var $chatPanel = $("#singlechatpanel-1");

        if(!$chatPanel.is(':hidden'))
        {
            alert("Room 1 is filled.");
            $chatPanel.show();
            $("#singlechatpanel-1 #chatter_nickname").html("Chatting with: " + chatterNickname);
        }
});

Ответ 6

if (!$('#singlechatpanel-1').css('display') == 'none') {
   alert('visible');
}else{
   alert('hidden');
}

Ответ 7

Добавьте свой li в класс и сделайте $(".myclass").hide(); в начале, чтобы скрыть его вместо атрибута стиля видимости.

Насколько я знаю, jquery использует атрибут стиля display для отображения/скрытия элементов вместо видимости (может быть, неверно на этом, в любом случае это стоит попробовать)