用JavaScript隐藏控件的方法


Posted in Javascript onSeptember 21, 2009

当style.display="block"或style.visibility="visible"时控件或见,当style.display = "none"或style.visibility = "hidden"时控件不可见。
不同的是“display”不但隐藏控件,而且被隐藏的控件不再占用显示时占用的位置,而“visibility”隐藏的控件仅仅是将控件设置成不可见了,控件仍然占俱原来的位置。
<p>
<input id='control' value="想要隐藏的控件">
</p>
<p>
隐藏上面的控件,并使其不占用页面上的位置
<input type="button" value='隐藏' onclick='displayHide_control()'>
<input type="button" value='显示' onclick='displayShow_control()'>
<br />
仅仅隐藏控件,其位置仍然占用
<input type="button" value='隐藏' onclick='visibilityHide_control()'>
<input type="button" value='显示' onclick='visibilityShow_control()'>
</p>
<script language="javascript" type="text/javascript">
function displayHide_control()
{
var _control = document.getElementById("control");
_control.style.display="none";
}
function displayShow_control()
{
var _control = document.getElementById("control");
_control.style.display="block";
}
function visibilityHide_control()
{
var _control = document.getElementById("control");
_control.style.visibility="hidden";
}
function visibilityShow_control()
{
var _control = document.getElementById("control");
_control.style.visibility="visible";
}
</script>

Javascript 相关文章推荐
清华大学出版的事半功倍系列 javascript全部源代码
May 04 Javascript
jQuery 使用手册(六)
Sep 23 Javascript
javascript温习的一些笔记 基础常用知识小结
Jun 22 Javascript
input链接页面、打开新网页等等的具体实现
Dec 30 Javascript
js如何打印object对象
Oct 16 Javascript
跟我学习javascript的var预解析与函数声明提升
Nov 16 Javascript
Bootstrap Chart组件使用教程
Apr 28 Javascript
javascript实现用户点击数量统计
Dec 25 Javascript
js实现hashtable的赋值、取值、遍历操作实例详解
Dec 25 Javascript
Bootstrap里的文件分别代表什么意思及其引用方法
May 01 Javascript
利用vue重构有赞商城的思路以及总结整理
Feb 21 Javascript
微信小程序分包加载代码实现方法详解
Sep 23 Javascript
jquery 子窗口操作父窗口的代码
Sep 21 #Javascript
通过JS 获取Mouse Position(鼠标坐标)的代码
Sep 21 #Javascript
用jQuery技术实现Tab页界面之二
Sep 21 #Javascript
Tab页界面,用jQuery及Ajax技术实现
Sep 21 #Javascript
一个js写的日历(代码部分网摘)
Sep 20 #Javascript
下载站控制介绍字数显示的脚本 显示全部 隐藏介绍等功能
Sep 19 #Javascript
js表格分页实现代码
Sep 18 #Javascript
You might like
php查找字符串出现次数的方法
2014/12/01 PHP
php查询操作实现投票功能
2016/05/09 PHP
thinkphp,onethink和thinkox中验证码不显示的解决方法分析
2016/06/06 PHP
Laravel模型事件的实现原理详解
2018/03/14 PHP
mailto的使用技巧分享
2012/12/21 Javascript
js控制滚动条缓慢滚动到顶部实现代码
2013/03/20 Javascript
javascript静态页面传值的三种方法分享
2013/11/12 Javascript
JavaScript SetInterval与setTimeout使用方法详解
2013/11/15 Javascript
javascript实现点击后变换按钮显示文字的方法
2015/05/13 Javascript
js实现温度计时间样式代码分享
2015/08/21 Javascript
javascript实现瀑布流加载图片原理
2016/02/02 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
2017/02/06 Javascript
微信小程序  http请求封装详解及实例代码
2017/02/15 Javascript
jQuery实现图片滑动效果
2017/03/08 Javascript
vue结合element-ui使用示例
2019/01/24 Javascript
js+html5 canvas实现ps钢笔抠图
2019/04/28 Javascript
ES6中定义类和对象的方法示例
2019/07/31 Javascript
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
对python中的xlsxwriter库简单分析
2018/05/04 Python
Python 项目转化为so文件实例
2019/12/23 Python
浅谈对pytroch中torch.autograd.backward的思考
2019/12/27 Python
利用CSS3的特性改变文本选中时的颜色
2013/09/11 HTML / CSS
Html5大文件断点续传实现方法
2015/12/05 HTML / CSS
阿联酋网上花店:Ferns N Petals
2018/02/14 全球购物
IdealFit官方网站:女性蛋白质、补充剂和运动服装
2019/03/24 全球购物
解释DataSet(ds) 和 ds as DataSet 的含义
2014/07/27 面试题
大学生就业自荐信
2013/10/26 职场文书
网络公司美工设计工作个人的自我评价
2013/11/03 职场文书
酒店员工职业生涯规划
2014/02/25 职场文书
《秋游》教学反思
2014/04/24 职场文书
党的生日活动方案
2014/08/15 职场文书
青年标兵事迹材料
2014/08/16 职场文书
花木兰观后感
2015/06/10 职场文书
MySQL中几种插入和批量语句实例详解
2021/09/14 MySQL
如何利用 CSS Overview 面板重构优化你的网站
2021/10/24 HTML / CSS
用PYTHON去计算88键钢琴的琴键频率和音高
2022/04/10 Python