2013-04-27 6 views
7

У меня есть функция javascript, которая пытается определить, является ли div видимым и выполняет различные процессы с этой переменной. Я успешно могу поменять видимость элементов, изменив его отображение между none и block; но я не могу сохранить это значение ...Поиск, если элемент виден (JavaScript)

Я попытался получить значение атрибута отображения элементов и узнать, является ли идентификатор элемента видимым, но ни один из них не работал. Когда я пытаюсь .getAttribute, он всегда возвращает null; Я не уверен, почему, потому что я знаю, что идентификатор определен и имеет атрибут отображения.

Вот код из двух различных методов я пробовал:

var myvar = $("#mydivID").is(":visible"); 
var myvar = document.getElementById("mydivID").getAttribute("display"); 

Любое руководство или помощь будет принята с благодарностью.

+4

'display' является членом' style' собственности, не является атрибутом. – MaxArt

+0

@MaxArt: Я тоже пытался использовать видимый, но это тоже не сработало. Так что, если я не могу вызвать отображение, потому что его свойство CSS, а не атрибут JavaScript, как я буду отслеживать это? –

+0

Как вы определяете "visible"? Учитываются ли элементы за пределами области просмотра? Учет видимости: скрытый? –

ответ

9

Дисплей не является атрибутом, это свойство CSS внутри атрибута style.

Вы можете искать

var myvar = document.getElementById("mydivID").style.display; 

или

var myvar = $("#mydivID").css('display'); 
16

Попробуйте так:

$(function() { 
    // Handler for .ready() called. 
    if ($("#mydivID").is(":visible")) { 
     alert('Element is visible'); 
    } 
}); 

FIDDLE

Пожалуйста, не забудьте включить файл JQuery внутри тега head следующим

<head> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
</head> 
+1

@Derek 朕 會 功夫: Потому что OP четко заявила в вопросе, что этот подход был предпринят, и не работал. – 2013-04-27 18:28:14

+0

@amnotiam Не очень понятно, скажем. – SeinopSys

+1

@amnotiam - Несмотря на то, что он сказал, что это не сработало, код Палаша выглядит полностью верным мне. –

6

Давайте на секунду, чтобы увидеть, что .is(":visible") делает в JQuery, мы должны?

Вот ссылка: https://github.com/jquery/jquery/blob/master/src/css.js#L529

return !jQuery.expr.filters.hidden(elem);

где

jQuery.expr.filters.hidden = function(elem) { 
    // Support: Opera <= 12.12 
    // Opera reports offsetWidths and offsetHeights less than zero on some elements 
    return elem.offsetWidth <= 0 && elem.offsetHeight <= 0; 
}; 

Таким образом, это просто проверка ширины смещения и высоту элемента.

Это сказало, а также стоит отметить, когда JQuery проверяет, имеет ли элемент скрыт (т.е. как при запуская «тумблер» событие), он выполняет проверку на имуществодисплея и его существования в доме. https://github.com/jquery/jquery/blob/master/src/css.js#L43

+1

Чтобы быть честным, это не * действительно * ответ на вопрос. – SeinopSys

+0

Я не уверен, какая версия jQuery, и я не хочу смотреть, но последняя версия делает больше, чем просто: 'return elem.offsetWidth <= 0 && elem.offsetHeight <= 0 || \t \t \t (jQuery.support.reliableHiddenOffsets && ((elem.style && elem.style.display) || jQuery.css (эль, "дисплей")) === "нет"!); ' – Ian

+0

хорошо, это дает некоторое представление о том, почему то, что он пытался, не работает и/или правильно, а затем дает представление о том, что должно быть сделано, которое получает свойство «display», на которое вы уже ответили ... так .... –

3

Если вы хотели бы сделать это только яваскрипт, как вы можете попробовать

window.getComputedStyle(document.getElementById("mydivID"),null).getPropertyValue('display') 
Смежные вопросы