There is a block with input as in the picture below. It is necessary to select an album, for the subsequent loading of pictures into this album. When you select (Press input radio), the text of the album description is displayed.
So, in the added code, the div is displayed as needed, but with one nuance. When selected, old divs do not close. It is necessary to correct the existing code so that when selecting the album, the old description is closed and the new one appears.
Clearly described?
As a result, you need a code that closes the div from the block that cleans up the checked.

Example:

Example

<script type="text/javascript"> $(document).ready(function(){ show("bloggood1", "cat1","$_GET[a]"); }); function show(bloggood, cat, id){ bloggood = document.getElementById(bloggood); cat = document.getElementById(cat); albom = document.getElementById('albom_vibor'); if (bloggood.checked){ albom_vibor.value = id; cat.style.display = "block"; }else{ albom_vibor.value = ''; cat.style.display = "none"; }; }; </script> 
  <div class='addimage-albom-box'> <input type='radio' name='bloggood' class="radio" id="bloggood$albom[id]" onchange='show("bloggood$albom[id]","cat$albom[id]","$albom[id]");'/> <label for='bloggood$albom[id]'>$albom[title]</label> <div id='cat$albom[id]' class='addimage-albom-box-opisanie'> $albom[opisanie] <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> </div>

  • And what have you failed? Can I see your attempt to do something? Or do you do everything from scratch? - Alexey Shimansky
  • I have an example with checked pages on jsfiddle, you can easily remake it under radio. The rest is done very simply, hide the desired div or show it with the active input - Mr. Black
  • It shows me a div in the selected radio, but does not remove it from the others. if (bloggood.checked) {cat.style.display = "block";} I do it by assigning css. - Albert Ushakov
  • Well? The question is relevant, it would be cool if you threw off the ready code of your version ... - Albert Ushakov
  • 3
    @ Albert Ushakov doesn’t do the job for you here ..... but they’ll do the freelancing job for you - Alexey Shimansky

2 answers 2

 $('input[type=radio]').change(function() { var thisDescription = $(this).parent().find('.addimage-albom-box-opisanie'); thisDescription.slideDown(); $('.addimage-albom-box-opisanie').not(thisDescription).slideUp(); }); 
 .addimage-albom-box-opisanie { display: none; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='addimage-albom-box'> <input type='radio' name='r' id="r1" /> <label for='r1'>Radio 1</label> <div class='addimage-albom-box-opisanie'> <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> </div> <div class='addimage-albom-box'> <input type='radio' name='r' id="r2" /> <label for='r1'>Radio 2</label> <div class='addimage-albom-box-opisanie'> <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> </div> <div class='addimage-albom-box'> <input type='radio' name='r' id="r3" /> <label for='r1'>Radio 3</label> <div class='addimage-albom-box-opisanie'> <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> </div>

    something like this. either js pure or jquery.

     //$(".addimage-albom-box-opisanie").prop("hidden", true); //$("[name=bloggood]").change(function(){ // var id = $(this).attr("data-id"); // console.log(id); // $(".addimage-albom-box-opisanie").prop("hidden", true); // $("#" + id).prop("hidden", false); //}) 
     .addimage-albom-box-opisanie { display: none; } 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> function foo(item) { var id = item.getAttribute("data-id"); console.log(id); var x = document.getElementsByClassName("addimage-albom-box-opisanie"); var i; for (i = 0; i < x.length; i++) { if (i == id - 1) { x[i].style.display = "block"; } else { x[i].style.display = "none"; } } }; </script> <div class='addimage-albom-box'> <input type='radio' name='bloggood' class="radio" id="radio1" data-id="1" onchange='foo(this);' /> <label for='bloggood$albom[id]'>radio1</label> <div id='1' class='addimage-albom-box-opisanie'> <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> <br> <input type='radio' name='bloggood' class="radio" id="radio2" data-id="2" onchange='foo(this);' /> <label for='bloggood$albom[id]'>radio2</label> <div id='2' class='addimage-albom-box-opisanie'> <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> <br> <input type='radio' name='bloggood' class="radio" id="radio3" data-id="3" onchange='foo(this);' /> <label for='bloggood$albom[id]'>radio3</label> <div id='3' class='addimage-albom-box-opisanie'> <small>Вы выбрали этот альбом. Теперь Вы можете загрузить картинку в него.</small> </div> </div>

    • Thank you all for the help) - Albert Ushakov