javascript实现信息的显示和隐藏如注册页面
更新时间：2013年12月03日 17:15:46 作者：
信息的显示和隐藏在某些时候还是比较使用的，就比如注册信息，下面有个不错的示例，感兴趣的朋友可以了解下
我们在写注册页面的时候，必填信息是可见的，可选信息是隐藏的，如果用户希望填写，可以单击“详细信息”。
<!-- 下面代码通过javascript实现信息的显示和隐藏 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function $(idvalue){
return document.getElementById(idvalue);
}
function showtext(){
if($('text').style.display == 'none'){
$('text').style.display = '';
}else{
$('text').style.display = 'none';
}
}
</script>
</head>
<body>
<div id="text" style="display:none;">这里是隐藏信息</div>
<button id="morebtn" onclick="showtext();">详细信息</button>
</body>
</html>
复制代码 代码如下:
<!-- 下面代码通过javascript实现信息的显示和隐藏 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function $(idvalue){
return document.getElementById(idvalue);
}
function showtext(){
if($('text').style.display == 'none'){
$('text').style.display = '';
}else{
$('text').style.display = 'none';
}
}
</script>
</head>
<body>
<div id="text" style="display:none;">这里是隐藏信息</div>
<button id="morebtn" onclick="showtext();">详细信息</button>
</body>
</html>
相关文章
利用ajaxfileupload插件实现文件上传无刷新的具体方法
利用ajaxfileupload插件实现文件上传无刷新的具体方法，需要的朋友可以参考一下2013-06-06
今天小编就为大家分享一篇 layui扩展上传组件模拟进度条的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
本文将详细介绍下如何使用百度地图JSAPI生成的H7N9感染分布图，有对百度api感兴趣的朋友可以参考下哈，希望可以帮助到你2013-04-04
描述 event代表事件的状态，例如触发event对象的元素、鼠标的位置及状态、按下的键等等。2011-01-01
这篇文章主要介绍了js获取form的方法,实例分析了javascript操作form表单的技巧,需要的朋友可以参考下2015-05-05
下面小编就为大家带来一篇js以分隔符分隔数组中的元素并转换为字符串的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-11-11
JavaScript基于inquirer封装一个控制台文件选择器
这篇文章主要介绍了JavaScript基于inquirer封装一个控制台文件选择器，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的朋友可以参考一下2022-08-08
通过BootStrap-select插件 js jQuery控制select属性变化
bootstrap-select我想大家都不陌生是一个前端下拉框的插件非常好用，在select的标签中设置属性可以做很多功能控制，下面通过本文给大家详细介绍下2017-01-01
这篇文章主要介绍了JavaScript延迟加载之async与defer的应用场景与使用区别的介绍，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-09-09
这篇文章主要介绍了使用webpack搭建vue项目实现脚手架功能，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
最新评论