用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 相关文章推荐
国外Lightbox v2.03.3 最新版 下载
Oct 17 Javascript
javascript取消文本选定的实现代码
Nov 14 Javascript
基于JQuery的日期联动实现代码
Feb 24 Javascript
jquery 获取标签名(tagName)示例代码
Jul 11 Javascript
Extjs的FileUploadField文件上传出现了两个上传按钮
Apr 29 Javascript
jquery插件validation实现验证身份证号等
Jun 04 Javascript
JavaScript 函数节流详解及方法总结
Feb 09 Javascript
vue中echarts3.0自适应的方法
Feb 26 Javascript
angularjs实现对表单输入改变的监控(ng-change和watch两种方式)
Aug 29 Javascript
面试题:react和vue的区别分析
Apr 08 Javascript
详解vue-router 动态路由下子页面多页共活的解决方案
Dec 22 Javascript
浅析TypeScript 命名空间
Mar 19 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中文本操作的类
2007/03/17 PHP
PHP 字符截取 解决中文的截取问题,不用mb系列
2009/09/29 PHP
PHP错误Cannot use object of type stdClass as array in错误的解决办法
2014/06/12 PHP
php查询mysql数据库并将结果保存到数组的方法
2015/03/18 PHP
Laravel框架实现多数据库连接操作详解
2019/07/12 PHP
JavaScript判断密码强度(自写代码)
2013/09/06 Javascript
js捕获鼠标滚轮事件代码
2013/12/16 Javascript
Node.js的特点和应用场景介绍
2014/11/04 Javascript
javascript获取当前鼠标坐标的方法
2015/01/10 Javascript
JavaScript实现的一个倒计时的类
2015/03/12 Javascript
jQuery判断一个元素是否可见的方法
2015/06/05 Javascript
浅谈js 闭包引起的内存泄露问题
2015/06/22 Javascript
浅谈$(document)和$(window)的区别
2015/07/15 Javascript
JavaScript实现点击文本自动定位到下拉框选中操作
2016/06/15 Javascript
jQuery flip插件实现的翻牌效果示例【附demo源码下载】
2016/09/20 Javascript
Angular.js实现多个checkbox只能选择一个的方法示例
2017/02/24 Javascript
详解在Vue中通过自定义指令获取dom元素
2017/03/04 Javascript
vue中的 $slot 获取插槽的节点实例
2019/11/12 Javascript
解决vue-router路由拦截造成死循环问题
2020/08/05 Javascript
关于Js中new操作符的作用详解
2021/02/21 Javascript
[01:02:20]Mineski vs TNC 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
基于Python实现的扫雷游戏实例代码
2014/08/01 Python
浅谈pandas中shift和diff函数关系
2018/04/08 Python
python导入坐标点的具体操作
2019/05/10 Python
python 实现批量替换文本中的某部分内容
2019/12/13 Python
python+selenium+Chrome options参数的使用
2020/03/18 Python
python 检测图片是否有马赛克
2020/12/01 Python
阿巴庭院:Abba Patio
2019/06/18 全球购物
十一酒店活动方案
2014/02/20 职场文书
解除劳动合同协议书范本
2014/04/14 职场文书
党员承诺践诺书
2014/05/20 职场文书
中学生2014国庆节演讲稿:不屈的民族
2014/09/21 职场文书
2014年爱国卫生工作总结
2014/11/22 职场文书
大学生简历自我评价2015
2015/03/03 职场文书
开学第一天的感想
2015/08/10 职场文书
高一地理教学工作总结
2015/08/12 职场文书