<html> <head> <meta charset="utf-8"> <title>下拉框与文本框之间的转换</title> <script language="JavaScript"> function demo(){ var sel=document.all["sel"]; var tx=document.all["txt"]; //alert(sel.value=="other"); if(sel.value=="other"){ document.all["sel"].style.display="none"; //设置样式为不显示 tx.type="text"; //设置属性为文本格式 （之前的是hidden属性） } } function demo2(){ var sel=document.all["sel"]; var tx=document.all["txt"]; if(tx.value.trim()==""){ sel.style.display="block"; tx.type="hidden"; } } </script> </head> <body> <form> <fieldset style="width:500px;margin-left:32%;margin-top:10%;"> <legend >下拉框与文本框之间的转换</legend> <table border="1" cellpadding="5px" cellspacing="0" align="center" style="margin-top:10%;margin-bottom:10%;" width="300px" height="150px"> <tr> <td align="center">用户类别：</td> <td align="center"> <!--<div >--> <select id="sel" onchange="demo()"> <option value="student">学生</option> <option value="soldiers">军官</option> <option value="citizens">公民</option> <option value="other">其他</option> </select> <!--</div>--> <input type="hidden" name="txt" id="txt" value="123456" size="10" onblur="demo2()"/> <!--<input type="txt" name="txt2" >--> </td> </tr> </table> </fieldset> </form> </body> </html>
相关文章：