用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 相关文章推荐
HTTP状态代码以及定义(解释)
Feb 02 Javascript
JavaScript Undefined,Null类型和NaN值区别
Oct 22 Javascript
高性能WEB开发 flush让页面分块,逐步呈现 flush让页面分块,逐步呈现
Jun 19 Javascript
基于jquery可配置循环左右滚动例子
Sep 09 Javascript
JS延迟加载加快页面打开速度示例代码
Dec 30 Javascript
jQuery获取标签文本内容和html内容的方法
Mar 27 Javascript
Javascript刷新窗口方法小结
Oct 21 Javascript
AngularJS入门教程之ng-checked 指令详解
Aug 01 Javascript
Vue2 模板template的四种写法总结
Feb 23 Javascript
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 jQuery
微信小程序吸底区域适配iPhoneX的实现
Apr 09 Javascript
vue3.0搭配.net core实现文件上传组件
Oct 29 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 AJAX实例根据邮编自动完成地址信息
2008/11/23 PHP
php检测文本的编码
2015/07/26 PHP
PHP使用strrev翻转中文乱码问题的解决方法
2017/01/13 PHP
jQuery 定时局部刷新(setInterval)
2010/11/19 Javascript
jquery获取下拉列表的值为null的解决方法
2011/03/18 Javascript
javascript中return,return true,return false三者的用法及区别
2015/11/17 Javascript
原生JavaScript制作计算器
2016/10/16 Javascript
原生js实现节日时间倒计时功能
2017/01/18 Javascript
原生JS实现图片翻书效果
2017/02/16 Javascript
javascript 封装Date日期类实例详解
2017/05/28 Javascript
ReactNative实现图片上传功能的示例代码
2017/07/11 Javascript
js实现加载页面就自动触发超链接的示例
2017/08/31 Javascript
微信小程序websocket实现聊天功能
2020/03/30 Javascript
vue store之状态管理模式的详细介绍
2019/06/13 Javascript
微信小程序实现页面浮动导航
2020/01/08 Javascript
node.js 如何监视文件变化
2020/09/01 Javascript
token 机制和实现方式
2020/12/15 Javascript
[01:14]3.19DOTA2发布会 三代刀塔人第二代
2014/03/25 DOTA
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
Python迭代器和生成器介绍
2015/03/06 Python
Python检测生僻字的实现方法
2016/10/23 Python
简单谈谈Python流程控制语句
2016/12/04 Python
Python字符串拼接六种方法介绍
2017/12/18 Python
python安装virtualenv虚拟环境步骤图文详解
2019/09/18 Python
Flask之pipenv虚拟环境的实现
2019/11/26 Python
在django中使用apscheduler 执行计划任务的实现方法
2020/02/11 Python
matlab中imadjust函数的作用及应用举例
2020/02/27 Python
浅谈Python中re.match()和re.search()的使用及区别
2020/04/14 Python
PyQt5 QDockWidget控件应用详解
2020/08/12 Python
Tretorn美国官网:瑞典外套和鞋类品牌,抵御风雨
2018/07/19 全球购物
运动鞋、足球鞋和慕尼黑球衣:Sport Münzinger
2019/08/26 全球购物
欧洲最大的高尔夫零售商:American Golf
2019/09/02 全球购物
业务副厂长岗位职责
2014/01/03 职场文书
企业宣传工作方案
2014/06/02 职场文书
2015年业务工作总结范文
2015/04/10 职场文书
国庆阅兵观后感
2015/06/15 职场文书