JavaScript设置FieldSet展开与收缩


Posted in Javascript onMay 15, 2009

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" src="images/constringency.png" onclick="FieldSetVisual('t_ShipInportInfo','fset_ShipInportInfo','img_ShipInportInfo')" />车船到厂记录<span style="color: Red;" style="color: Red;">(已录入/未录入)</span></legend> 
<table width="100%" border="0" cellpadding="0" cellspacing="0" id="t_ShipInportInfo" 
style="visibility: visible;" style="visibility: visible;"> 
<tr> 
<td> 
车船名:<span style="font-weight: bold;" style="font-weight: bold;">车皮 等 共50节</span> 
</td> 
<td> 
车船到达时间:2009年5月9日 17时 
</td> 
<td> 
来煤方式:<span style="font-weight: bold;" style="font-weight: bold;">铁路</span> 
</td> 
<td> 
煤炭来源:<span style="font-weight: bold;" style="font-weight: bold;">淮南</span> 
</td> 
</tr> 
</tr> 
</table> 
</fieldset>
Javascript 相关文章推荐
Div自动滚动到末尾的代码
Oct 26 Javascript
google jQuery 引用文件,jQuery 引用地址集合(jquery 1.2.6至jquery1.5.2)
Apr 24 Javascript
js转义字符介绍
Nov 05 Javascript
百度地图API之本地搜索与范围搜索
Jul 30 Javascript
JavaScript对象数组的排序处理方法
Oct 21 Javascript
jqueryMobile 动态添加元素,展示刷新视图的实现方法
May 28 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
Sep 17 Javascript
javaScript实现滚动条事件详解
Mar 24 Javascript
Vue-cli3简单使用(图文步骤)
Apr 30 Javascript
基于JavaScript实现贪吃蛇游戏
Mar 16 Javascript
jquery实现简单自动轮播图效果
Jul 29 jQuery
解决vue页面刷新,数据丢失的问题
Nov 24 Vue.js
childNodes.length与children.length的区别
May 14 #Javascript
DOM下的节点属性和操作小结
May 14 #Javascript
JQuery textlimit 显示用户输入的字符数 限制用户输入的字符数
May 14 #Javascript
JavaScript 动态将数字金额转化为中文大写金额
May 14 #Javascript
JS面向对象、prototype、call()、apply()
May 14 #Javascript
JavaScript Date对象使用总结
May 14 #Javascript
jQuery 技巧大全(新手入门篇)
May 12 #Javascript
You might like
php UTF8 文件的签名问题
2009/10/30 PHP
php iconv() : Detected an illegal character in input string
2010/12/05 PHP
PHP 第二节 数据类型之数组
2012/04/28 PHP
PHP中shuffle数组值随便排序函数用法
2014/11/21 PHP
yii2安装详细流程
2018/05/23 PHP
js对象与打印对象分析比较
2013/04/23 Javascript
Jquery 跨域访问 Lightswitch OData Service的方法
2013/09/11 Javascript
JS获取键盘上任意按键的值(实例代码)
2013/11/12 Javascript
Javascript验证上传图片大小[前台处理]
2014/07/18 Javascript
5个书写JavaScript代码的坏习惯,看看你中枪了没?
2014/11/06 Javascript
js实现的星星评分功能函数
2015/12/09 Javascript
Jquery判断form表单数据是否变化
2016/03/30 Javascript
jQuery如何封装输入框插件
2016/08/19 Javascript
微信小程序 侧滑删除(左滑删除)
2017/05/23 Javascript
js实现网页版贪吃蛇游戏
2020/02/22 Javascript
Vue axios获取token临时令牌封装案例
2020/09/11 Javascript
vue 中使用print.js导出pdf操作
2020/11/13 Javascript
[47:48]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第三局
2016/02/28 DOTA
python实现数独算法实例
2015/06/09 Python
Python抓取聚划算商品分析页面获取商品信息并以XML格式保存到本地
2018/02/23 Python
对pandas中apply函数的用法详解
2018/04/10 Python
python 每天如何定时启动爬虫任务(实现方法分享)
2018/05/21 Python
python实现寻找最长回文子序列的方法
2018/06/02 Python
用python标准库difflib比较两份文件的异同详解
2018/11/16 Python
Python2和Python3之间的str处理方式导致乱码的讲解
2019/01/03 Python
python调用opencv实现猫脸检测功能
2019/01/15 Python
Python将主机名转换为IP地址的方法
2019/08/14 Python
使用python os模块复制文件到指定文件夹的方法
2019/08/22 Python
一文弄懂Pytorch的DataLoader, DataSet, Sampler之间的关系
2020/07/03 Python
《钱学森》听课反思
2014/03/01 职场文书
《狮子和兔子》教学反思
2014/03/02 职场文书
电子信息工程专业自荐书
2014/06/24 职场文书
义务教育学校标准化建设汇报材料
2014/08/16 职场文书
社区活动总结
2015/02/04 职场文书
会计岗位工作总结
2015/08/12 职场文书
《兰兰过桥》教学反思
2016/02/20 职场文书