Несколько одновременно исполняемых селекторов
Добрый день.
Не знаю как это называется, но:
$(function(){
if ($('#da, #po, #projects, #opens, #effect, #potencial').is(':empty')) {
$('#person #face').addClass('empty');
};
});
как сделать что бы класс присваивался только тогда когда все из перечисленных селекторов пустые? Подскажите пожалуйста? Заранее спасибо! |
Цитата:
var o=$('#da, #po, #projects, #opens, #effect, #potencial');
if (o.filter(':empty').length==o.length) {
$('#person #face').addClass('empty');
};
Не проверял... :no: |
Может так?
$(function(){
if ($('#da, #po, #projects, #opens, #effect, #potencial').toArray().every(function(item){
return $(item).is(':empty');
})) {
$('#person #face').addClass('empty');
};
});
|
Спасибо, но не один из вариантов не подошёл(
|
|
Цитата:
Так даже не понятно с чем ты вообще имеешь дело... |
Прошу прощения.
Понял свою ошибку - объясню максимально конкретно)
<div id="person">
<div id="face"><img src="img.jpg"></div>
<div id="info"></div>
<div id="medal">
<div id="da"></div>
<div id="po"></div>
<div id="projects"></div>
<div id="opens"></div>
<div id="effect"></div>
<div id="potencial"></div>
</div>
</div>
В диве #medal есть дочерние дивы. Если они все пустые, без контента - то #face addClass .empty. |
emptyindorill, уже лучше... :)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
.empty {
color: red;
}
</style>
<script type='text/javascript'>
$(function(){
var o=$('#medal > div');
if (o.filter(':empty').length==o.length) {
$('#face').addClass('empty');
};
});
</script>
</head>
<body>
<div id="person">
<div id="face">Empty</div>
<div id="info"></div>
<div id="medal">
<div id="da"></div>
<div id="po"></div>
<div id="projects"></div>
<div id="opens"></div>
<div id="effect"></div>
<div id="potencial"></div>
</div>
</div>
</body>
</html>
|
https://jsfiddle.net/knhz8u1L/1/
<html>
<head>
<title></title>
<script src='https://code.jquery.com/jquery-latest.js'></script>
<style>
.empty{
min-height:30px;
background:red;
}
</style>
</head>
<body>
<div id="person">
<div id="face"><img src="img.jpg"></div>
<div id="info"></div>
<div id="medal">
<div id="da"></div>
<div id="po"></div>
<div id="projects"></div>
<div id="opens"></div>
<div id="effect"></div>
<div id="potencial"></div>
</div>
</div>
<script>
$(function(){
$('#medal > div').toArray().every(function(item){
return $(item).is(':empty');
}) && $('#person').addClass('empty');
});
</script>
</body>
|
emptyindorill,
вам ksa давал код, и он рабочий.
var box = $('#medal').find('>div');
if(box.filter(':empty').length == box.length) ....
|
Уважаемые знатоки.
Спасибо Вам большое за помощь и обратную связь. По jsfiddle вижу что все варианты работают, но заметил один момент: https://jsfiddle.net/knhz8u1L/13/ https://jsfiddle.net/knhz8u1L/14/ https://jsfiddle.net/knhz8u1L/15/ Если родителей - #person больше одного, скрипт перестаёт работать. https://jsfiddle.net/knhz8u1L/17/ Пробовал через .each(), толку ноль. |
emptyindorill, id должен быть уникальным.
Используйте вместо "id" "class". Upd. https://jsfiddle.net/knhz8u1L/18/ |
Да, мне уже пояснили.
$('.person').each(function(){
if($(this).find('.medal > *').length == $(this).find('.medal > *:empty').length){
$(this).find('.face').addClass('empty');
}
});
Спасибо большое Вам и всем за оказанную помощь! |
Цитата:
|
$('.person').each(function() {
if(!$(this).find('.medal:has(>:not(:empty))').length) {
$(this).find('.face').addClass('empty');
}
});
|
Цитата:
Подскажите пожалуйста, а если всё-таки есть нужда в проверке, например, строки таблицы, на пустые td с классом каким-либо? Если класс такой + такой и + такой пустые то для tr .addClass или .css ? |
Цитата:
$('div:empty').parent().addClass('empty');
|
| Часовой пояс GMT +3, время: 08:39. |