JavaScript设置FieldSet展开与收缩

  

    JavaScript方法代码：

     // 设置FieldSet高度方法，支持IE浏览器、Firefox // 参数1：pTableID，FieldSet内部div或table的id // 参数2：pFieldSetID，FieldSet的ID // 参数3：pImageID，图片的ID，展开或收缩后更新图片SRC function FieldSetVisual( pTableID, pFieldSetID, pImageID ) { var objTable = document.getElementById( pTableID ) ; var objFieldSet = document.getElementById( pFieldSetID) ; var objImage = document.getElementById( pImageID) ; if( objTable.style.visibility == 'visible' ) { objTable.style.visibility = 'hidden' ; objFieldSet.style.height = "22px" ; objImage.src="images/expand.png" ; } else { objTable.style.visibility = 'visible'; var heightFieldSet = parseInt( objFieldSet.style.height.substr(0,objFieldSet.style.height.length-2)) ; var heightTable = parseInt( objTable.offsetHeight ) ; objFieldSet.style.height = heightFieldSet + heightTable + "px" ; objImage.src="images/constringency.png" ; } } 

   

    HTML中FieldSet代码：

    <fieldset id="fset_ShipInportInfo"> <legend> <img alt="展开或收缩" id="img_ShipInportInfo" src="images/constringency.png" mce_src="images/constringency.png" onclick="FieldSetVisual('t_ShipInportInfo','fset_ShipInportInfo','img_ShipInportInfo')" />车船到厂记录<span style="color: Red;" mce_style="color: Red;">（已录入/未录入）</span></legend> <table width="100%" border="0" cellpadding="0" cellspacing="0" id="t_ShipInportInfo" style="visibility: visible;" mce_style="visibility: visible;"> <tr> <td> 车船名：<span style="font-weight: bold;" mce_style="font-weight: bold;">车皮 等 共50节</span> </td> <td> 车船到达时间：2009年5月9日 17时 </td> <td> 来煤方式：<span style="font-weight: bold;" mce_style="font-weight: bold;">铁路</span> </td> <td> 煤炭来源：<span style="font-weight: bold;" mce_style="font-weight: bold;">淮南</span> </td> </tr> </tr> </table> </fieldset>