分類區塊隱藏與顯示的控制

需求：每個區塊都有一個CheckBox，當CheckBox被勾選，才顯示該區塊


<input type="checkbox" onclick="cbFunction(this);" id="cb1" name="cb1" runat="server">
T1

<br>

<div id="v1" style="DISPLAY:none">

<table>

<tr>

<td>This is table 1</td>

</tr>

<tr>

<td>

<asp:TextBox id="TextBox1" runat="server"></asp:TextBox>

<asp:Button id="Button1" runat="server" Text="隱藏Table1"></asp:Button></td>

</tr>

</table>

</div>

<br>

<input type="checkbox" onclick="cbFunction(this);" id="cb2" name="cb2" runat="server">
T2

<br>

<div id="v2" style="DISPLAY:none">

<table>

<tr>

<td>This is table 2</td>

</tr>

<tr>

<td>

<asp:TextBox id="TextBox2" runat="server"></asp:TextBox>

<asp:Button id="Button2" runat="server" Text="隱藏Table2"></asp:Button></td>

</tr>

</table>

</div>

</form>

<script>

function cbFunction(object)

{



if(object.id=='cb1')

{

if(object.checked)

{



document.all.v1.style.display='';

}

else

{



document.all.v1.style.display='none';

}

}

if(object.id=='cb2')

{

if(object.checked)

{



document.all.v2.style.display='';

}

else

{



document.all.v2.style.display='none';

}

}

}



cbFunction(document.all.cb1);

cbFunction(document.all.cb2);

</script>