AlexOk,
<html>
<head>
<title> </title>
<style type="text/css">
.tab{
width: 300px;
}
.tab > div{
float: left;
width: 100px;
}
.tab > div input{
width: 100%;
}
</style>
</head>
<body>
<li>
<label>check1</label>
<input onclick="show('1')" type="checkbox" id="c1" name="option1" value="a2">
</li>
<li>
<label>check2</label>
<input onclick="show('2')" type="checkbox" id="c2" name="option2" value="a2">
</li>
<li>
<label>check3</label>
<input onclick="show('3')" type="checkbox" id="c3" name="option3" value="a2">
</li>
<li>
<label>check4</label>
<input onclick="show('4')" type="checkbox" id="c4" name="option4" value="a2">
</li>
<li>
<label>check5</label>
<input onclick="show('5')" type="checkbox" id="c5" name="option5" value="a2">
</li>
<li>
<label>check6</label>
<input onclick="show('6')" type="checkbox" id="c6" name="option6" value="a2">
</li>
<div class="tab" >
<div id="1" style="display: none">
<label>Input1</label>
<input class="i1" type="text" name="name" />
</div>
<div id="2" style="display:none">
<label>Input2</label>
<input class="i2" type="text" name="name" />
</div>
<div id="3" style="display: none">
<label>Input3</label>
<input class="i3" type="text" name="name" />
</div>
<div id="4" style="display: none">
<label>Input4</label>
<input class="i4" type="text" name="name" />
</div>
<div id="5" style="display: none">
<label>Input5</label>
<input class="i5" type="text" name="name" />
</div>
<div id="6" style="display: none">
<label>Input6</label>
<input class="i6" type="text" name="name" />
</div>
</div>
<script type="text/javascript">
function show(id){
display = document.getElementById(id).style.display;
if(display=='none'){
document.getElementById(id).style.display='block';
}else{
document.getElementById(id).style.display='none';
}
}
</script>
</body>
</html>