There are 6 blocks with checkbox. When clicked, they hide:

$( 'input[type=checkbox]' ).click(function(){ $('.catalog:has(input:checked)') .animate({ opacity: "0.5"},1000) .delay(1000) .fadeOut(1000); });

I need that after hiding these blocks ( display:none ), a DIV with text is added over it.

Tried to implement like this:

 var countCatalog=$('.catalog').length; var catalogNone=$('.catalog:hidden').length; $(function () { if ($(countCatalog)==(catalogNone)){ $('.work').addClass('.new__block'); } });

but does not work (

Also tried the length of input:checked with a length of just input and then add a new Class. Please help, I have been suffering for a week.

  • If you are given an exhaustive answer, mark it as correct (a daw opposite the selected answer). - Nicolas Chabanovsky ♦

2 answers 2

UPD. Carefully read what needs to be done and redid the code. Now it seems to work as it should.

 $('input[type="checkbox"]').change(function() { var checkedLength = $('input[type="checkbox"]:checked').length; $(this) .animate({ opacity: "0.5" }, 1000) .delay(1000) .fadeOut(1000, function() { if ($('input[type="checkbox"]').length == checkedLength) { $('.checkbox-parent').append('<div class="add-box">Нажимать больше нечего</div>'); }; }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="checkbox-parent"> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> </div>

  • Thank you very much))) I'll try to apply the code in my own)) If I know where I will turn)) - densokovikov

I didn’t read the code, but I already see a problem in $(countCatalog)==(catalogNone) $(countCatalog) is a jQuery call with a number transfer. The result will be an array with one element - this number. Those.:

 $(1) -> [1]

And it turns out that you are comparing an array with a number, so the result is always false .

You also add a class incorrectly, you need to write without a dot . :

 $('.work').addClass('new__block');
  • Just learning) Inattention (So how do I end up like this? If ($ (countCatalog) == $ (catalogNone)) {$ ('. Work'). AddClass ('new__block');}}); - densokovikov
  • And you will have [1] == [1] -> false. Why call jQuery? Just compare two numbers: countCatalog == catalogNone. Normal Js - skubarenko
  • I don’t know, it still doesn’t work (var countCatalog = $ ('. Catalog'). Length; var catalogNone = $ ('. Catalog: hidden'). Length; $ (function () {if (countCatalog == catalogNone) { $ ('. work'). addClass ('new__block')}}); - densokovikov