用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 相关文章推荐
Pro JavaScript Techniques学习笔记
Dec 28 Javascript
jquery 与NVelocity 产生冲突的解决方法
Jun 13 Javascript
写自已的js类库需要的核心代码
Jul 16 Javascript
Thinkphp模板没有解析直接原样输出的解决方法
Oct 31 Javascript
JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解
Aug 06 Javascript
jQuery插件实现文字无缝向上滚动效果代码
Feb 25 Javascript
vue-resource 拦截器使用详解
Feb 21 Javascript
jQuery实现的点击标题文字切换字体效果示例【测试可用】
Apr 26 jQuery
详解基于Node.js的HTTP/2 Server实践
May 31 Javascript
vuejs数据超出单行显示更多,点击展开剩余数据实例
May 05 Javascript
Vue 中如何将函数作为 props 传递给组件的实现代码
May 12 Javascript
详解Vue router路由
Nov 20 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 处理上百万条的数据库如何提高处理查询速度
2010/02/08 PHP
php创建基本身份认证站点的方法详解
2013/06/08 PHP
由php中字符offset特征造成的绕过漏洞详解
2017/07/07 PHP
Prototype Template对象 学习
2009/07/19 Javascript
javascript 必知必会之closure
2009/09/21 Javascript
JS获取dom 对象 ajax操作 读写cookie函数
2009/11/18 Javascript
js 事件处理函数间的Event物件是否全等
2011/04/08 Javascript
JQuery为textarea添加maxlength属性并且兼容IE
2013/04/25 Javascript
jQuery的context属性用法实例
2014/12/27 Javascript
简单谈谈Javascript中类型的判断
2015/10/19 Javascript
JS实现网页上随滚动条滚动的层效果代码
2015/11/04 Javascript
Jquery跨浏览器文本复制插件Zero Clipboard的使用方法
2016/02/28 Javascript
浅谈JS获取元素的N种方法及其动静态讨论
2017/08/25 Javascript
iframe与主框架跨域相互访问实现方法
2017/09/14 Javascript
vue双向数据绑定知识点总结
2018/04/18 Javascript
配置node服务器并且链接微信公众号接口配置步骤详解
2019/06/21 Javascript
layui 对table中的数据进行转义的实例
2019/09/12 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
2020/09/07 Javascript
vue3为什么要用proxy替代defineProperty
2020/10/19 Javascript
Python判断直线和矩形是否相交的方法
2015/07/14 Python
python爬虫获取多页天涯帖子
2018/02/23 Python
Python实现提取XML内容并保存到Excel中的方法
2018/09/01 Python
Django bulk_create()、update()与数据库事务的效率对比分析
2020/05/15 Python
浅谈keras 模型用于预测时的注意事项
2020/06/27 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
python中altair可视化库实例用法
2021/01/26 Python
美国滑雪和滑雪板商店:Buckman
2018/03/03 全球购物
涉密人员保密承诺书
2014/05/28 职场文书
社团活动总结怎么写
2014/06/30 职场文书
2014党员学习习主席讲话思想汇报
2014/09/15 职场文书
致我们终将逝去的青春观后感
2015/06/10 职场文书
思品教学工作总结
2015/08/10 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
python中redis包操作数据库的教程
2022/04/19 Python
Win11软件图标固定到任务栏
2022/04/19 数码科技
Win11 KB5015814遇安装失败 影响开始菜单性能解决方法
2022/07/15 数码科技