Форум

emptyindorill · #1 (**permalink**) 23.10.2017, 16:11

Добрый день.

Не знаю как это называется, но:

$(function(){
   if ($('#da, #po, #projects, #opens, #effect, #potencial').is(':empty')) {
      $('#person #face').addClass('empty');
   };
});

как сделать что бы класс присваивался только тогда когда все из перечисленных селекторов пустые?

Подскажите пожалуйста?

Заранее спасибо!

ksa · #2 (**permalink**) 23.10.2017, 16:20

Сообщение от emptyindorill

как сделать что бы класс присваивался только тогда когда все из перечисленных селекторов пустые?

Как вариант...

var o=$('#da, #po, #projects, #opens, #effect, #potencial');
   if (o.filter(':empty').length==o.length) {
      $('#person #face').addClass('empty');
   };

Не проверял...

Nexus · #3 (**permalink**) 23.10.2017, 16:21

Может так?

$(function(){
   if ($('#da, #po, #projects, #opens, #effect, #potencial').toArray().every(function(item){
	   return $(item).is(':empty');
   })) {
      $('#person #face').addClass('empty');
   };
});

emptyindorill · #4 (**permalink**) 23.10.2017, 16:43

Спасибо, но не один из вариантов не подошёл(

Nexus · #5 (**permalink**) 23.10.2017, 17:01

emptyindorill, это все инпуты?

Upd. https://jsfiddle.net/knhz8u1L/

ksa · #6 (**permalink**) 24.10.2017, 08:34

Сообщение от emptyindorill

но не один из вариантов не подошёл

Так ты бы полный пример сделал, а не кусок кода.

Так даже не понятно с чем ты вообще имеешь дело...

emptyindorill · #7 (**permalink**) 24.10.2017, 09:03

Прошу прощения.

Понял свою ошибку - объясню максимально конкретно)

<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.

ksa · #8 (**permalink**) 24.10.2017, 09:43

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>

Nexus · #9 (**permalink**) 24.10.2017, 09:44

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>

laimas · #10 (**permalink**) 24.10.2017, 09:46

emptyindorill,
вам ksa давал код, и он рабочий.

var box = $('#medal').find('>div');
    if(box.filter(':empty').length == box.length) ....

Форум

Справочник

Discord чат

Курсы javascript