用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 相关文章推荐
js 触发select onchange事件代码
Mar 20 Javascript
JQuery记住用户名和密码的具体实现
Apr 04 Javascript
jQuery 全选 全部选 反选 实现代码
Aug 17 Javascript
网络传输协议(http协议)
Nov 18 Javascript
浅谈javascript的闭包
Jan 23 Javascript
jQuery.form.js的使用详解
Jun 14 jQuery
JS查找数组中重复元素的方法详解
Jun 14 Javascript
js获取地址栏参数的两种方法
Jun 27 Javascript
简单快速的实现js计算器功能
Aug 17 Javascript
仿淘宝JSsearch搜索下拉深度用法
Jan 15 Javascript
深入Vue-Router路由嵌套理解
Aug 13 Javascript
vue-element-admin项目导入和导出的实现
May 21 Vue.js
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语法(4)
2006/10/09 PHP
PHP分页显示制作详细讲解
2008/11/19 PHP
深入理解PHP之数组(遍历顺序)  Laruence原创
2012/06/13 PHP
PHP数据类型之布尔型的介绍
2013/04/28 PHP
浅析PHP中Session可能会引起并发问题
2015/07/23 PHP
Symfony学习十分钟入门经典教程
2016/02/03 PHP
PHP数学运算函数大汇总(经典值得收藏)
2016/04/01 PHP
php输出形式实例整理
2020/05/05 PHP
JavaScript高级程序设计
2006/12/29 Javascript
IE和Firefox在JavaScript应用中的兼容性探讨
2008/04/01 Javascript
最简单的jQuery程序 入门者学习
2009/07/09 Javascript
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
2009/11/14 Javascript
关于this和self的使用说明
2010/08/01 Javascript
Js控制弹窗实现在任意分辨率下居中显示
2013/08/01 Javascript
AJAX跨域请求json数据的实现方法
2013/11/11 Javascript
js过滤特殊字符输入适合输入、粘贴、拖拽多种情况
2014/03/22 Javascript
分享一则JavaScript滚动条插件源码
2015/03/03 Javascript
JavaScript数据库TaffyDB用法实例分析
2015/07/27 Javascript
深入解析Javascript闭包的功能及实现方法
2016/07/10 Javascript
基于bootstrop常用类总结(推荐)
2017/09/11 Javascript
在vue中使用Autoprefixed的方法
2018/07/27 Javascript
python实现的生成随机迷宫算法核心代码分享(含游戏完整代码)
2014/07/11 Python
跟老齐学Python之深入变量和引用对象
2014/09/24 Python
详细解读Python中的__init__()方法
2015/05/02 Python
python删除服务器文件代码示例
2018/02/09 Python
Python实现投影法分割图像示例(一)
2020/01/17 Python
Python+OpenCV图像处理——图像二值化的实现
2020/10/24 Python
纽约香氛品牌:NEST Fragrance
2018/10/15 全球购物
德国最新街头服饰网上商店:BODYCHECK
2019/09/15 全球购物
运动会入场解说词300字
2014/01/25 职场文书
保研推荐信
2014/05/09 职场文书
保护环境倡议书500字
2014/05/19 职场文书
文秘自荐信
2014/06/28 职场文书
导游词之无锡古运河
2019/11/14 职场文书
Go语言应该什么情况使用指针
2021/07/25 Golang
CentOS下安装Jenkins的完整步骤
2022/04/07 Servers