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 相关文章推荐
从零开始学习jQuery (二) 万能的选择器
Oct 01 Javascript
使用GruntJS构建Web程序之Tasks(任务)篇
Jun 06 Javascript
5个可以帮你理解JavaScript核心闭包和作用域的小例子
Oct 08 Javascript
JavaScript中constructor()方法的使用简介
Jun 05 Javascript
javascript+HTML5自定义元素播放焦点图动画
Feb 21 Javascript
微信小程序 获取当前地理位置和经纬度实例代码
Dec 05 Javascript
JS中使用gulp实现压缩文件及浏览器热加载功能
Jul 12 Javascript
bootstrap日期插件daterangepicker使用详解
Oct 19 Javascript
JS+CSS实现网页加载中的动画效果
Oct 27 Javascript
微信小程序实现的涂鸦功能示例【附源码下载】
Jan 12 Javascript
深入理解es6块级作用域的使用
Mar 28 Javascript
微信小程序scroll-view锚点链接滚动跳转功能
Dec 12 Javascript
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
精致的人儿就要挑杯子喝咖啡
2021/03/03 冲泡冲煮
PHP安装攻略:常见问题解答(一)
2006/10/09 PHP
PHP 命名空间实例说明
2011/01/27 PHP
兼容各大浏览器带关闭按钮的漂浮多组图片广告代码
2014/06/05 PHP
AES加解密在php接口请求过程中的应用示例
2016/10/26 PHP
yii2.0整合阿里云oss上传单个文件的示例
2017/09/19 PHP
PHP编程一定要改掉的5个不良习惯
2020/09/18 PHP
javascript实现unicode和字符的互相转换
2007/07/18 Javascript
JavaScript中“+”的陷阱深刻理解
2012/12/04 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
javascript简单实现图片预加载
2014/12/03 Javascript
JavaScript事件学习小结(五)js中事件类型之鼠标事件
2016/06/09 Javascript
深入浅析JavaScript中的3DES
2016/08/24 Javascript
Vue.js中数据绑定的语法教程
2017/06/02 Javascript
vue-swiper的使用教程
2018/08/30 Javascript
mpvue写一个CPASS小程序的示例
2018/09/04 Javascript
Typescript3.9 常用新特性一览(推荐)
2020/05/14 Javascript
在vue项目中封装echarts的步骤
2020/12/25 Vue.js
python使用三角迭代计算圆周率PI的方法
2015/03/20 Python
python实现爬虫统计学校BBS男女比例之多线程爬虫(二)
2015/12/31 Python
Django小白教程之Django用户注册与登录
2016/04/22 Python
Python中MySQL数据迁移到MongoDB脚本的方法
2016/04/28 Python
深入理解python try异常处理机制
2016/06/01 Python
利用Django内置的认证视图实现用户密码重置功能详解
2017/11/24 Python
Python中类的初始化特殊方法
2017/12/01 Python
python脚本实现mp4中的音频提取并保存在原目录
2020/02/27 Python
浅谈python处理json和redis hash的坑
2020/07/16 Python
call在Python中改进数列的实例讲解
2020/12/09 Python
利用python实现后端写网页(flask框架)
2021/02/28 Python
德国传统玻璃制造商:Cristalica
2018/04/23 全球购物
人力资源专员自我评价怎么写
2013/09/19 职场文书
红色经典观后感
2015/06/18 职场文书
休学证明范本
2015/06/19 职场文书
2016年社区“我们的节日·中秋节”活动总结
2016/04/05 职场文书
redis内存空间效率问题的深入探究
2021/05/17 Redis
Python Pandas pandas.read_sql_query函数实例用法分析
2021/06/21 Python