上代码：

　　

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>点击按钮弹出输入框</title>

<style>

p{ margin:0; padding:0;}

.login-put {

clear: both;

line-height: 36px;

margin-bottom: 20px;

overflow: hidden;

width: 500px;

}

.login-put label {

color: #8c8686;

float: left;

font-size: 14px;

height: 36px;

line-height: 36px;

text-align: right;

width: 120px;

}

#form1{ float:left; width:320px}

#form1 label {

float: left;

text-align: left;

width: 80px;

}

input {

cursor: pointer;

vertical-align: middle;

}

.login-put #div1 {

padding-left: 120px;

}

.login-put #div1 input {

border: 1px solid #dddddd;

color: #999999;

float: left;

height: 36px;

line-height: 36px;

margin-right: 10px;

padding: 0 5px;

width: 190px;

}

</style>

</head>

<body>

<div class="login-put"><label>点击：</label>

<form id="form1" name="form1" method="post" action="">

<p>

<label>

<script type="text/javascript">

function show()

{

var value = document.getElementById("div1").style.display;

if(value=="none")

{

document.getElementById("div1").style.display="block";

}

else

document.getElementById("div1").style.display="none";

}

</script>

<input type="button" value="我是按钮" onClick="show()"/>

<div id="div1" style="display:none">

    <input class="text01" name="" type="text" />

</div>

</div>

</body>

</html>

　　

　　效果：

　　

　　END

Html ： 点击按钮弹出输入框，再次点击进行隐藏的更多相关文章

  1. JavaScript实现点击按钮弹出输入框，点确定后添加li组件到ul组件里

    JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里 <!doctype html> <html manifest="lab4.manifest&q ...

  2. jquery实现点击按钮弹出层和点击空白处隐藏层

    昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){                $('.autoBtn' ...

  3. ExtJs 4.2.1 点击按钮弹出表单的窗口

    初学ExtJs,做项目的时候想做一个这样的效果:点击按钮弹出对话框,之前一直是使用EasyUi来做的, EasyUi里有Dialog,用起来很方便,但是现在转移到ExtJs上后,发现没有Dialog这 ...

  4. 请写出一段JavaScript代码，要求页面有一个按钮，点击按钮弹出确认框。程序可以判断出用

    请写出一段JavaScript代码,要求页面有一个按钮,点击按钮弹出确认框.程序可以判断出用 户点击的是“确认”还是“取消”. 解答: <HTML> <HEAD> <TI ...

  5. jquery点击按钮弹出图片

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. 点击按钮弹出一个div层

    JQuery弹出层,点击按钮后弹出遮罩层,还有关闭按钮 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml& ...

  7. ASP.NET点击按钮弹出确认对话框方法

    开发asp.net网页应用程序的时候,有些页面的按钮需要增加一个确认对话框,比如: 实现这个功能比较简单,代码这样写: Button.Attributes["onclick"] = ...

  8. Asp.net点击按钮弹出文件夹选择框的实现（网页）

    本文地址:http://www.cnblogs.com/PiaoMiaoGongZi/p/4092112.html 在Asp.net网站实际的开发中,比如:需要实现点击一个类似于FileUpload的 ...

  9. 点击datagrid弹出ldhdialog，点击弹出框的按钮，关闭且刷新datagrid

    datagrid里的js这么写 //点击添加按钮触发 function superadd(title,addurl,gname,width,height) { gridname=gname; crea ...

随机推荐

  1. Django之auth模块（用户认证）登陆组件

    auth模块简介 auth模块是对登录认证方法的一种封装,之前我们获取用户输入的用户名及密码后需要自己从user表里查询有没有用户名和密码符合的对象, 而有了auth模块之后就可以很轻松的去验证用户的 ...

  2. Linux下Redis安装使用，主从模式，哨兵模式与PHP扩展(PHP7适用)

    一,软件准备 #redis wget http://download.redis.io/releases/redis-3.0.7.tar.gz #phpredis 非php7使用 下载后文件名为:ph ...

  3. my21_myloader -o参数

    -o 参数 如果不使用-o参数,遇到第一个有主键或者唯一约束的数据,则退出当前线程:如果有-o参数,则删除原来的表,创建新表,再插入数据,主键不会发生变化. ** Message: Dropping ...

  4. spring MVC设置不拦截静态资源

    问题产生: 因为我们在web.xml中写了 拦截所有请求,当然包括了静态资源,所以页面需要引用css或js的话,该请求也会被拦截,例如: 在style.css中写一个简单样式,加个背景颜色  body ...

  5. 安装NetCDF及HDF5

    平台信息 Description: CentOS Linux release 7.6.1810 (Core) 安装步骤 下载NetCDF.HDF5.zlib.curl[使用wget命令即可] 解包:t ...

  6. visual stdio使用

    现在转换使用visual stdio,因为很多和以前的快捷键不同,也不打算换了,这样可移动性应该更好吧. 1.注释代码, 首先按下ctrl + k,然后再按下ctrl + c 2.取消注释,首先按下c ...

  7. Beam内置的数据源清单（Java、Python）

    不多说,直接上干货! Beam内置的Java数据源清单: Beam内置的Python数据源清单:  

  8. 断路器hystrix

    分布式系统中不可避免的会出现一些故障,因为服务间错综复杂的依赖关系,有时候一个服务出现问题后,会导致依赖于它的服务出现远程调度的线程受阻,给服务造成压力,当然同样的,祖父级调用者(暂且这么叫吧)当然也 ...

  9. php防止重复提交问题总结

    用户提交表单时可能因为网速的原因,或者网页被恶意刷新,致使同一条记录重复插入到数据库中,这是一个比较棘手的问题.我们可以从客户端和服务器端一起着手,设法避免同一表单的重复提交. 1．使用客户端脚本 提 ...

  10. 纯CSS控制背景图片100%自适应填充布局

    https://blog.csdn.net/wd4java/article/details/50537562 解决:   html,body{height: 100%;width: 100%;marg ...