Greetings to all who have entered. Punching one topic, and gently ask her.

Imagine a form (quite simple), inside form 2 input-radio. Please help with 2 questions:

First: Is it possible to make such a JS that would hide the div when switching input-radio? Imagine you downloaded such a form, and you see it all, taped a switch - and part of the form was hidden.

<form...> <input type="radio" CHECKED> <input type="radio"> <input type="text"...> <input type="text"...> <div id="div_kotoriy_menayetsa"> <input type="text"...> <input type="text"...> <input type="text"...> </div> <input type="hidden" value="ch1"> <input type="submit"...> </form> 

Second: is it possible to make a similar, but opposite, script when loading a form, what would be the 2nd (and not 1st) input-radio to be CHECKED, and accordingly, the div wants to hide from the beginning?

upd. corrected a small mistake

  • Correct the imput on input. In short, these tasks are easy to accomplish. - Zhukov Roman
  • updated. didn't even notice right away - frank

3 answers 3

@frank, you need to change your form a bit:

 <form> <input type="radio" name="switch-div_kotoriy_menayetsa" value="1"> <input type="radio" name="switch-div_kotoriy_menayetsa" value="0" checked="checked"> <input type="text" > <input type="text" > <div id="div_kotoriy_menayetsa"> <input type="text" > <input type="text" > <input type="text" > </div> <input type="hidden" value="ch1"> <input type="submit"> </form> 

But the script itself (not pure JS):

 <!-- Да, вариант с jQuery --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script> $('input[type=radio][name=switch-div_kotoriy_menayetsa]').change(function() { $('#div_kotoriy_menayetsa').toggle( $('input[type=radio][name=switch-div_kotoriy_menayetsa]:checked').val() == 1 ? true : false); }) .change(); </script> 

It is possible and without problems with jQuery, but then it will be clumsy, or this simple script will gobble up.

What radio will have checked="checked" will be on by default, respectively, and the div will either be hidden or shown after the page loads.

  • yes, it doesn't matter, with JQ or not. thanks - frank

First: Is it possible to make such a JS

Can.

Secondly, is it possible to make a similar, but opposite, script when loading a form, so that initially 2nd (and not 1st) input-radio would be CHECKED,

Can.

  • one
    Plus :) I wanted to write the same answer, but limited to comment. - Zhukov Roman
  • Fun. Scare code? - frank
  • No, we will not frighten what question, such is the answer. You wrote “is it possible” and received the answer “It is possible”. I don’t write the code as I know it and assure you, but you want it to be written to you "as if by chance", so as not to think for myself, am I wrong? What did you do to make your form work that way? Nothing but a question in this forum. The code in jQuery or JS is only 1 line. ("input [@name = ''] [checked]"). val (); // so for reference. \ + wrap it all on the event onklik. - Artem
  • I myself think how to write this for a week. before that, 2 of my previous topics here on the hashcode ended in nothing. The only thing that I learned that you do not need to pop into the table form. About one line - because he tried to write, he learned that all the same not one. I'll try with this advice, something else to figure out - frank
 var el_hide = $('#div_kotoriy_menayetsa'); el_hide.hide(); // скрываем необходимый элемент $("input:radio:not(:checked)").click(function() { el_hide.toggle('slow'); // TODO: На Ваше усмотрение // $("input:radio:checked").attr("checked", false); // $(this).attr("checked", true); }) 

PS The question is trivial and therefore, in order not to receive an answer like the above, it is necessary to develop a discipline of independence in yourself.

  • unfortunately the acceptance has already stuck, but for the future I will consider and the decision and advice on behavior - frank
  • one
    @frank Here is a good material on selectors for beginners from the "prospector" Shevchuk. [jQuery for beginners. Selectors] [1] [1]: anton.shevchuk.name/javascript/jquery-for-beginners-selectors - romeo