HTML+CSS+JavaScript

Подскажите как сделать:

Для поля с radiobutton

Показать таблицу с полями номер 1
Показать таблицу с полями номер 2
Показать таблицу с полями номер 1 и 2

Чтобы пользователь переключая варианты, сразу видел нужную ему таблицу для заполения формы.=)

<script type="text/javascript"> function selForm(v){  alert(document.forms.length);  for (i = 0; i < document.forms.length; i++) {    if(document.forms[i].name == v) document.forms[i].style.display = "";    else document.forms[i].style.display = "none";   } } </script> <input type="radio" name="ch" value="f1" onclick="selForm(this.value)"> 1 <input type="radio" name="ch" value="f2" onclick="selForm(this.value)"> 2 <input type="radio" name="ch" value="f3" onclick="selForm(this.value)"> 3 <input type="radio" name="ch" value="f4" onclick="selForm(this.value)"> 4 <input type="radio" name="ch" value="f5" onclick="selForm(this.value)"> 5 <form action="" name="f1" style="display: none;">   <input type="text" value="form1"> </form> <form action="" name="f2" style="display: none;">   <input type="text" value="form2"> </form> <form action="" name="f3" style="display: none;">   <input type="text" value="form3"> </form> <form action="" name="f4" style="display: none;">   <input type="text" value="form4"> </form> <form action="" name="f5" style="display: none;">   <input type="text" value="form5"> </form>

Под себя переделаете..
PS. В код не заглядывал..
На этом же форуме кто то спрашивал, себе в качестве примера скопировал.
UP. Мельком глянув..
Хочу особо подчеркнуть что именно "onclick".. а не что то другое будут советовать
Фак ин..
посмотрев ещё..
вот это перепишите
for (i = 0, var len = document.forms.length; i < len; i++) {
Но так правильнее..
В принцыпе и так и так бы работало,

Возникла проблема. У меня уже есть одна общая форма в листе.

Как переделать скрипт на показ/скрытие DIV'а.

Можно по разному.. отталкиваясь от того что вам действительно надо, а не только от того что вы написали..
Вот.. один из вариантов.

<style type="text/css"> <!-- .class_div{border:2px dashed #FF0000;margin:6px;padding:6px;display:none;} --> </style> <script type="text/javascript">  function myFunc(v){   var obj = document.forms['name_form'].getElementsByTagName('div');   for(var i = 0, n = 0, len = obj.length; i < len; i++){     if(obj[i].className == 'class_div'){       obj[i].style.display = 'none';       if(v == n) obj[i].style.display = 'block';       n++;     }   } }  </script> <form action="" method="post" name="name_form">   <input type="radio" name="ch" value="0" onclick="myFunc(this.value)">   <input type="radio" name="ch" value="1" onclick="myFunc(this.value)">   <input type="radio" name="ch" value="2" onclick="myFunc(this.value)">   <input type="radio" name="ch" value="3" onclick="myFunc(this.value)">   <input type="radio" name="ch" value="4" onclick="myFunc(this.value)">   <div class="class_div">000000</div>   <div class="class_div">111111</div>   <div class="class_div">222222</div>   <div class="class_div">333333</div>   <div class="class_div">444444</div> </form>

Спасиб.Слушай я вот хотел вместо кнопки radio поставил image и че то не работает

<style type="text/css">  <!--  .class_div{border:2px dashed #FF0000;margin:6px;padding:6px;display:none;}  -->  </style>  <script type="text/javascript">   function myFunc(v){    var obj = document.forms['name_form'].getElementsByTagName('div');    for(var i = 0, n = 0, len = obj.length; i < len; i++){      if(obj[i].className == 'class_div'){        obj[i].style.display = 'none';        if(v == n) obj[i].style.display = 'block';        n++;      }    }  }   </script>  <form action="" method="post" name="name_form">   <input  type="image" src="but/menu.jpg" name="ch2" value="0" onclick="myFunc(this.value)" />   <input type="image" src="but/proezd.jpg" name="ch" value="1" onclick="myFunc(this.value)">    <input type="image" src="but/photo.jpg" name="ch" value="2" onclick="myFunc(this.value)">    <input type="image" src="but/flaer.jpg" name="ch" value="3" onclick="myFunc(this.value)">      <div class="class_div">000000</div>    <div class="class_div">111111</div>    <div class="class_div">222222</div>    <div class="class_div">333333</div>    </form>

Что изменить еще?

<style type="text/css">   <!--   .class_div{border:2px dashed #FF0000;margin:6px;padding:6px;display:none;}   -->   </style> <script type="text/javascript">    function myFunc(v){   var obj = document.forms['name_form'].getElementsByTagName('div');     for(var i = 0, n = 0, len = obj.length; i < len; i++){       if(obj[i].className == 'class_div'){         obj[i].style.display = 'none';         if(v == n) obj[i].style.display = 'block';         n++;       }     }   }    </script> <form action="" method="post" name="name_form">   <input type="image" src="but/menu.jpg" name="ch0" value="0" onclick="myFunc(this.value); return false;">   <input type="image" src="but/proezd.jpg" name="ch1" value="1" onclick="myFunc(this.value); return false;">   <input type="image" src="but/photo.jpg" name="ch2" value="2" onclick="myFunc(this.value); return false;">   <input type="image" src="but/flaer.jpg" name="ch3" value="3" onclick="myFunc(this.value); return false;">   <div class="class_div">000000</div>   <div class="class_div">111111</div>   <div class="class_div">222222</div>   <div class="class_div">333333</div> </form>

return false; и правильно разные имена, это вам не радиогруппа.
Можно ещё так, пока не поймёте что и как работает, делайте проще.

<script type="text/javascript">    function myFunc(d){   document.getElementById('menu').style.display = 'none';   document.getElementById('proezd').style.display = 'none';   document.getElementById('photo').style.display = 'none';   document.getElementById('flaer').style.display = 'none';   document.getElementById(d).style.display = 'block';  }    </script> <form action="" method="post" name="name_form">   <input type="image" src="but/menu.jpg" name="ch0" value="0" onclick="myFunc('menu'); return false;">   <input type="image" src="but/proezd.jpg" name="ch1" value="1" onclick="myFunc('proezd'); return false;">   <input type="image" src="but/photo.jpg" name="ch2" value="2" onclick="myFunc('photo'); return false;">   <input type="image" src="but/flaer.jpg" name="ch3" value="3" onclick="myFunc('flaer'); return false;">   <div id="menu" style="border:2px dashed #FF0000;margin:6px;padding:6px;">menu</div>   <div id="proezd" style="display:none;border:2px dashed #FF0000;margin:6px;padding:6px;">proezd</div>   <div id="photo" style="display:none;border:2px dashed #FF0000;margin:6px;padding:6px;">photo</div>   <div id="flaer" style="display:none;border:2px dashed #FF0000;margin:6px;padding:6px;">flaer</div> </form>

Понял ошибки,спасибо!