JS实现信息的显示和隐藏

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

代码如下:
<!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>

JS实现信息的显示和隐藏的更多相关文章

  1. js控制密码的显示与隐藏实例

    原理是建立2个input,一个type是text,一个type是password.在点击按钮时,这两input个的显示状态与val()的值在切换. html: <!DOCTYPE html> ...

  2. JS控制元素的显示和隐藏

    利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: document.getElementB ...

  3. js控制元素的显示与隐藏

    <body class="easyui-layout"> <div id = "centerId" data-options="re ...

  4. js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

  5. jQuery效果之显示与隐藏

    .hide([duration][,complete])--目标元素的隐藏. .show([duration][,complete])--目标元素的显示: .toggle([duration][,co ...

  6. Js控制显示、隐藏文本框中的密码

    Js控制显示.隐藏文本框中的密码,也可称为是一款小型的JavaScript星号密码破解器,点击会显示出密码类型的文本框中的真实信息,再次点击则还原,程序 主要是获取HTML元素对象,然后强制更改元素属 ...

  7. js 与JQuery显示及隐藏方法

    虽然以后两种方式都能让文本信息隐藏和显示 第一种文本隐藏以后还是会占居位置, 第二种则不会占位置. <p id="p1">这是一段文本.</p> <i ...

  8. js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  9. JS控制HTML元素的显示和隐藏

    JS控制HTML元素的显示和隐藏 利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: 1 2 ...

随机推荐

  1. SQLSERVER 列名无效

    很多时候对数据库表修改字段后会出现“列名无效”,或者在查询分析器里面是红色的下划线,造成这个现象的原因是:SQL Server的intellisense(智能感知功能),没有感知到更改,需要重新整理一 ...

  2. Spring——自定义属性编辑器+Bean的生存范围+Bean的生命周期

    一.自定义属性编辑器(一个类): 步骤: 1.写一个类,这个类继承PropertyEditorSupport. 2.重写setAsText()方法. 3.在bean.xml文件中添加属性编辑器的bea ...

  3. Java和JavaScript的时间互传

    原创文章,转载请注明:Java和JavaScript的时间互传 By Lucio.Yang 1.从JavaScript到Java JavaScript: function query(){ var s ...

  4. mahout算法源码分析之Collaborative Filtering with ALS-WR 并行思路

    Mahout版本:0.7,hadoop版本:1.0.4,jdk:1.7.0_25 64bit. mahout算法源码分析之Collaborative Filtering with ALS-WR 这个算 ...

  5. codevs 1455 路径 计算m^n%p

    题目链接 题目描述 Description 小明从A1到An+1,他知道从A1到A2,从A2到A3,......,从An到An+1都有m条路,且从A1到An+1都只有这些路.小明想知道,从A1地到An ...

  6. Ztree异步树加载

    JSP代码片段 <%@ page language="java" contentType="text/html; charset=utf-8" pageE ...

  7. Foreach & add remove elements

    参考 http://stackoverflow.com/questions/11058384/how-to-delete-specific-array-elements-from-within-a-f ...

  8. 《转》JAVA并发编程:volatile关键字解析

    volatile这个关键字可能很多朋友都听说过,或许也都用过.在Java 5之前,它是一个备受争议的关键字,因为在程序中使用它往往会导致出人意料的结果.在Java 5之后,volatile关键字才得以 ...

  9. Vim 实用技术,第 2 部分: 常用插件(转)

    http://blog.jobbole.com/20619/ 2.1. gzip(压缩文件支持) 作者:Bram Moolenar 网站脚本编号:无(包含在 Vim 的标准发布之中) 安装说明:无 功 ...

  10. android -上传文件到服务器

    android上传文件到服务器       重点:最好是设置好content-type这些参数的配置!     package com.spring.sky.image.upload.network; ...