JavaScript DOM 获取焦点然后逐行显示

来源:互联网 发布:万方数据库检索式 编辑:程序博客网 时间:2024/05/23 23:48
<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style type="text/css">#demo1 input, #demo2 input, #demo3 input, #demo4 textarea{margin-top: 10px;}input {width: 180px;height: 20px;}#demo1{border: 1px solid #0CC;}#demo2 input, #demo3 input, #demo4 textarea {border: 1px solid #0CC;}label {display: none;}</style><script>function fun1(){var element=document.getElementById("demo2");element.style.display="block";}function fun2(){var element=document.getElementById("demo3");element.style.display="block";}function fun3(){var element=document.getElementById("demo4");element.style.display="block";}</script></head><body>姓    名:<input type="text" id="demo1" onFocus="fun1()" /><br /><label id="demo2">家庭住址:  <input type="text" onFocus="fun2()" />  <br /></label><label id="demo3">电    话:  <input type="text"  onFocus="fun3()" />  <br /></label><label id="demo4"> 个人简介:<br />             <textarea rows="10" cols="30"></textarea></label></body></html>

0 0
原创粉丝点击