Показать / Скрыть дивы на выбор радио

Question

У меня есть 3 div, которые содержат радио с метками, и под каждой радио-кнопкой я хотел бы показать / скрыть форму в зависимости от того, выбрано радио или нет.

Кодовая идея:

<div id="radio1"></div>
<div id="form1"></div>

<div id="radio2"></div>
<div id="form2"></div>

<div id="radio3"></div>
<div id="form3"></div>

Используя прототип, у кого-нибудь есть основная идея или предложение о том, как лучше всего это сделать. Любые предлагаемые скрипты или ссылки будут с благодарностью. Я новичок в создании прототипов, и мне трудно понять концепцию или найти что-нибудь полезное в Интернете. В теории я не думаю, что это будет слишком сложно, но заранее спасибо за любую помощь.

Answer 1

Используйте этот шаблон:

<div onclick="$('form1').toggle()" id="radio1"></div>
<div id="form1" style="display"none"></div>

Вы можете связать их вместе, чтобы контролировать и другие элементы:

<div onclick="$('form1').toggle();$('form2').hide();$('form3').hide()" id="radio1"></div>
<div id="form1" style="display"none"></div>

Существуют более эффективные способы сделать это, например, выбрать все элементы одного класса, скрыть их, а затем отобразить элемент, по которому щелкнули. Но с точки зрения начинающего, это должно делать то, что вы хотите.