javascript实现信息的显示和隐藏

 信息的显示和隐藏在某些时候还是比较使用的,就比如注册信息,下面有个不错的示例,感兴趣的朋友可以了解下

我们在写注册页面的时候,必填信息是可见的,可选信息是隐藏的,如果用户希望填写,可以单击“详细信息”。 
代码如下:
<!-- 下面代码通过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> 

时间: 2024-09-17 03:37:05

javascript实现信息的显示和隐藏的相关文章

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

我们在写注册页面的时候,必填信息是可见的,可选信息是隐藏的,如果用户希望填写,可以单击"详细信息". 复制代码 代码如下: <!-- 下面代码通过javascript实现信息的显示和隐藏 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <scrip

用javascript控制div的显示与隐藏

javascript|控制|显示 <html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><script language="JavaScript" type="text/JavaScript"><!--

javascript实现div的显示和隐藏的小例子

代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>oec2003</title> <script language="JavaScript" type="text/JavaScript"> <!-- fun

javascript实现div的显示和隐藏的小例子_javascript技巧

复制代码 代码如下: <html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>oec2003</title><script language="JavaScript" type="text/JavaScript"><!--func

Javascript控制DIV层显示与隐藏两个实例

简单指向文字显示内容实例  代码如下 复制代码 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>oec2003</title> <script language="JavaScript" type="text/JavaScript&quo

使用javascript控制cookie显示和隐藏背景图

 本文主要介绍了使用javascript来控制背景图片的显示和隐藏,当点击关闭按钮时,控制CSS使页面不加载背景图,同时记录COOKIE相关参数,并设置cookie的有效期 每当重大节日期间,各大主流网站首页会披上节日的盛装,设计者一般会使用大幅背景图片来获得更好的视觉冲击效果,当然,也要考虑到有些用户不习惯这大背景图,那么在背景图上放置"关闭"按钮是有必要的,用户只要点击"关闭背景"按钮,大幅背景图将会消失.   我们使用javascript来控制背景图片的显示和

javascript在一个function里控制loading的显示与隐藏

问题描述 代码如下,不知为何无法执行出loading显示后又隐藏的效果.<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>javascript在一个function里控制loading的显示与隐藏</title><script type="text/javascrip

JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素

原文:JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素 一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了看导航栏菜单项高亮显示时,已经写了部分内容,只是那时写的代码没有实现div显示和隐藏,现在就在之前编写的基础上,为页面添加显示和隐藏div的效果. 没有写Java

JavaScript实现下拉菜单的显示和隐藏_javascript技巧

我们这一篇来用JavaScript脚本实现下拉菜单的显示和隐藏.使用JavaScript方法实现我们需要用的知识有: 1)JS事件:onmouseover鼠标经过事件和onmouseout鼠标离开事件. 2)JS基础语法:使用function关键字定义函数. 3)DOM编程:getElementsByTagName()方法. 那么接下来就是我们制作的流程: 1)隐藏二级菜单:设置CSS样式,让二级菜单隐藏. 2)编写显示子菜单showsub()函数:使用getElementsByTagName获