оператор jQuery if для проверки видимости

Я пытаюсь написать скрипт, который будет Скрыть/показать элемент div в зависимости от видимости элементов. Действие должно происходить, когда я нажимаю на другой элемент. Вот что я написал до сих пор:--3--> 

$('#column-left form').hide();
    $('.show-search').click(function() {
        $('#column-left form').stop(true, true).slideToggle(300);
        if( $('#column-left form').css('display') == 'none' ) {
            $("#offers").show();
        } else {
            $('#offers').hide();
        }
    });

он скрывает div, но он не возвращается, когда я скрываю форму. Будет здорово за любую помощь:)

edit:

хорошо, мне удалось достичь желаемого эффекта, написав следующее:

$('#column-left form').hide();
    $('.show-search').click(function() {
        if ($('#column-left form').is(":hidden")) {
            $('#column-left form').slideToggle(300);
            $('#offers').hide();
        } else {
            $('#column-left form').slideToggle(300);
            $("#offers").show();
        }
    });

Я не знаю, правильно ли это написано, но это работает ;) Спасибо всем за помощь!

45
hide if-statement jquery show visible

6 ответов

можно использовать .is(':visible') чтобы проверить, если что-то видимое и .is(':hidden') чтобы проверить обратное:

$('#offers').toggle(!$('#column-left form').is(':visible')); // or:
$('#offers').toggle($('#column-left form').is(':hidden'));

ссылки:

118

Да, вы можете использовать .is(':visible') в jquery. Но пока код работает под браузером safari .is(':visible') is не будет работать.

поэтому, пожалуйста, используйте ниже код 

if( $(".example").offset().top > 0 )

вышеуказанная строка будет работать как IE, так и safari.

4

попробовать

if ($('#column-left form:visible').length > 0) { ...
2
 $('#column-left form').hide();
 $('.show-search').click(function() {
    $('#column-left form').stop(true, true).slideToggle(300); //this will slide but not hide that's why
    $('#column-left form').hide(); 
    if(!($('#column-left form').is(":visible"))) {
        $("#offers").show();
    } else {
        $('#offers').hide();
    }
  });
1

после исправления проблемы с производительностью, связанной с использованием .is ( ": visible"), я бы рекомендовал против вышеуказанных ответов и вместо этого использовать код jQuery для решения, является ли один элемент видимым:

$.expr.filters.visible($("#singleElementID")[0]);

что .is проверяет, находится ли набор элементов в другом наборе элементов. Таким образом, вы будете искать свой элемент во всем наборе видимых элементов на своей странице. Наличие 100 элементов довольно нормально и может занять несколько миллисекунд для поиска массив видимых элементов. Если вы создаете веб-приложение, у вас, вероятно, есть сотни или, возможно, тысячи. Наше приложение иногда принимало 100 мс за $("#selector").is (": visible"), так как он проверял, был ли элемент в массиве из 5000 других элементов.

0

если видна.

$("#Element").is(':visible');

если он скрыт.

$("#Element").is(':hidden');
0