jQuery обнаруживает видимые но скрытые элементы
Это кажется, что должно быть довольно легко - но я не могу найти правильный селектор для него
Согласно документам (http://api.jquery.com/hidden-selector/ и http://api.jquery.com/visible-selector/)...
Элементы можно считать скрытыми по нескольким причинам:
Элемент предка скрыт, таким образом, элемент не показывают на странице.
То, что я хочу обнаружить, является "этим элементом, видимо, но содержится в скрытом родителе". Т.е., если бы я сделал родителя видимым, то этот элемент также был бы видим.
2 ответа
Если это то, что вы обычно будете использовать, создайте свой собственный селектор :) Вот пример:
jQuery.expr[':'].hiddenByParent = function(a) {
return jQuery(a).is(':hidden') && jQuery(a).css('display') != 'none';
};
Вы можете его использовать вот так, тестовая разметка:
<div style="display: none" id="parent">
<div>
<div id="child">Test</div>
</div>
</div>
Примеры использования:
$("div:hiddenByParent").length; // "2" (plain div + child match)
$("#child").is(":hiddenByParent"); // true
В качестве альтернативы вы можете использовать функцию .filter () следующим образом:
$('selector').filter(function() {
return $(this).is(':hidden') && $(this).css('display') != 'none';
}
Если это конкретный элемент, который вы ищете, вы можете проверить его свойство отображения.
$('#element').css('display') != 'none';
Если это не конкретный элемент, вы можете найти скрытые родительские узлы с помощью: hidden, а затем использовать настраиваемую функцию для поиска узлов нужного вам типа. Например,
$('parent-selector:hidden').find('node-selector').each(function(){
if($(this).css('display') != 'none') {
// do what you wanted
}
});
Если вам нужен чистый селектор, я думаю, вам не повезет, так как я не думаю, что то, что вы хотите, является частью спецификации CSS, поэтому не будет его в качестве селектора в jQuery.