JavaScript隐藏控件的方法

使用JavaScript控制控件的隐藏与显示

最新推荐文章于 2013-06-15 18:02:19 发布

原创最新推荐文章于 2013-06-15 18:02:19 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #button #input #function #测试

Html&JS 专栏收录该内容

0 篇文章

订阅专栏

本文介绍了两种使用JavaScript隐藏和显示控件的方法，包括设置控件的`style.display`和`style.visibility`属性。示例代码展示了如何通过JavaScript函数隐藏和显示textarea元素，提供了四个按钮分别对应`visibility:hidden`、`visibility:visible`、`display:none`和`display:block`四种状态。

用JavaScript隐藏控件的方法有两种，分别是通过设置控件的style的“display”和“visibility”属性进行隐藏和显示。

要用display隐藏，必须要display进行显示。style.visibility="visible" 或者style.display="block" 时控件可见，

style.visibility="hidden" 或者style.display="none" 时控件不可见。

下面为具体的示例：

<head> <title>测试隐藏框体</title> <mce:script type="text/javascript"></mce:script> </head> <body> <input type="button" value="visibilit的hidden隐藏" onclick="hiddenUI()"/> <input type="button" value="visibilit的visible显示" onclick="visibleUI()"/> <br/> <input type="button" value="display的none隐藏" onclick="noneUI()"/> <input type="button" value="display的block显示" onclick="blockUI()"/> <br/> <input type="textarea" id="textarea1" rows="15" cols="5" value="测试框"/> </body> </html>

把“<mce:script type="text/javascript" ></mce:script> ”改成“<script> ”和</script> “,

也不知道为什么贴代码时就自动改了，大家改一下吧！！！