javascript实现信息的显示和隐藏如注册页面


Posted in Javascript onDecember 03, 2013

我们在写注册页面的时候,必填信息是可见的,可选信息是隐藏的,如果用户希望填写,可以单击“详细信息”。

<!-- 下面代码通过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 相关文章推荐
JavaScript 事件记录使用说明
Oct 20 Javascript
一款js和css代码压缩工具[附JAVA环境配置方法]
Apr 16 Javascript
AngularJS内置指令
Feb 04 Javascript
jQuery实现图片渐入渐出切换展示效果
Aug 15 Javascript
用AngularJS来实现监察表单按钮的禁用效果
Nov 02 Javascript
基于touch.js手势库+zepto.js插件开发图片查看器(滑动、缩放、双击缩放)
Nov 17 Javascript
AngularJs 利用百度地图API 定位当前位置 获取地址信息
Jan 18 Javascript
AngularJS实现根据不同条件显示不同控件
Apr 20 Javascript
vue2.0中click点击当前li实现动态切换class
Jun 21 Javascript
解决vuejs 使用value in list 循环遍历数组出现警告的问题
Sep 26 Javascript
vue-router重定向和路由别名的使用讲解
Jan 19 Javascript
解决vue初始化项目时,一直卡在Project description上的问题
Oct 31 Javascript
一个js控制的导航菜单实例代码
Dec 03 #Javascript
JS与C#编码解码
Dec 03 #Javascript
探讨jQuery的ajax使用场景(c#)
Dec 03 #Javascript
浅析JavaScript原型继承的陷阱
Dec 03 #Javascript
解析JavaScript中instanceof对于不同的构造器或许都返回true
Dec 03 #Javascript
探讨JavaScript中声明全局变量三种方式的异同
Dec 03 #Javascript
解析JavaScript中delete操作符不能删除的对象
Dec 03 #Javascript
You might like
php 输出双引号&quot;与单引号'的方法
2010/05/09 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
php中ob_flush函数和flush函数用法分析
2015/03/18 PHP
Twig模板引擎用法入门教程
2016/01/20 PHP
PHP+MySQL统计该库中每个表的记录数并按递减顺序排列的方法
2016/02/15 PHP
PHP的时间戳与具体时间转化的简单实现
2016/06/13 PHP
Swoole 5将移除自动添加Event::wait()特性详解
2019/07/10 PHP
记Laravel调用Gin接口调用formData上传文件的实现方法
2019/12/12 PHP
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
myFocus slide3D v1.1.0 使用方法与下载
2011/01/12 Javascript
JS 获取select(多选下拉)中所选值的示例代码
2013/08/02 Javascript
跨域传值即主页面与iframe之间互相传值
2013/12/09 Javascript
基于NodeJS的前后端分离的思考与实践(四)安全问题解决方案
2014/09/26 NodeJs
avalonjs实现仿微博的图片拖动特效
2015/05/06 Javascript
jquery序列化方法实例分析
2015/06/10 Javascript
JavaScript中数据结构与算法(五):经典KMP算法
2015/06/19 Javascript
Position属性之relative用法
2015/12/14 Javascript
javascript多物体运动实现方法分析
2016/01/08 Javascript
原生javascript+css3编写的3D魔方动画旋扭特效
2016/03/14 Javascript
JS实现图片放大镜插件详解
2017/11/06 Javascript
解决vue中修改了数据但视图无法更新的情况
2018/08/27 Javascript
angularJs中$scope数据序列化的实例
2018/09/30 Javascript
解决axios post 后端无法接收数据的问题
2019/10/29 Javascript
[10:18]2018DOTA2国际邀请赛寻真——Fnatic能否笑到最后?
2018/08/14 DOTA
让python json encode datetime类型
2010/12/28 Python
python进阶教程之词典、字典、dict
2014/08/29 Python
Windows系统配置python脚本开机启动的3种方法分享
2015/03/10 Python
Python实现常见的回文字符串算法
2018/11/14 Python
Python数据预处理之数据规范化(归一化)示例
2019/01/08 Python
python实践项目之监控当前联网状态详情
2019/05/23 Python
基于python3的socket聊天编程
2020/02/17 Python
深入剖析webstorage[html5的本地数据处理]
2016/07/11 HTML / CSS
希尔顿酒店中国网站:Hilton中国
2017/03/11 全球购物
力学专业毕业生自荐信
2013/11/17 职场文书
2014教师党员个人自我评议
2014/09/20 职场文书
HTML5之高度塌陷问题的解决
2022/06/01 HTML / CSS