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