JavaScript实践:点击CheckBox显示/隐藏Details
用一个CheckBox作为Flag,当选中Flag时,才会显示具体信息。
方法:
使用JavaScript的方法
具体:
页面代码:把需要显示/隐藏的<tr>设一个ID,如:
<tr id="WithinPkgs1" style="display: none;">
<tr id="WithinPkgs2" style="display: none;">
<tr id="WithinPkgs3" style="display: none;">
通过CheckBox的onclick事件调用函数:
<asp:CheckBox ID="chkWithinPkgsFlag" runat="server" onclick="flagShowTest('WithinPkgs',this.checked);" />
JavaScript函数为:
JavaScript
function flagShowTest(objIdPrefix, showFlag)
{
var i=1;
while(true)
{
var obj=document.getElementById(objIdPrefix+i);
if (obj==undefined||obj==null)
{ break; }
if(showFlag==true)
{
obj.style.display='';
}
else
{
obj.style.display='none';
}
i++;
}
}
{
var i=1;
while(true)
{
var obj=document.getElementById(objIdPrefix+i);
if (obj==undefined||obj==null)
{ break; }
if(showFlag==true)
{
obj.style.display='';
}
else
{
obj.style.display='none';
}
i++;
}
}