文本框样式 收录 已测试

来源:互联网 发布:设备维修保养软件 编辑:程序博客网 时间:2024/06/10 12:38
<%@ include file="/system/include/Taglibs.jsp" %><html><head><meta http-equiv="Content-Type" content="text/html; charset=GBK"><title>测试页面</title><script language="JavaScript">//self与oTime以及clearTimeout函数的用法function borderColor(){if(self['oText'].style.borderColor=='red'){self['oText'].style.borderColor = 'yellow';}else{self['oText'].style.borderColor = 'red';}oTime = setTimeout('borderColor()',400);}</script><script for="T" event="onkeyup"><%--if(value.length==3)document.all[event.srcElement.sourceIndex+1].select();--%>if(value.length==maxLength)document.all[event.srcElement.sourceIndex+1].focus();</script><script for="T" event="onfocus">select();</script><script for="Submit" event="onclick">var sn = "";var T = document.getElementsByName("T");for(i=0;i<T.length;i++){if(i == 0){sn = T[i].value;}else{sn += "-" + T[i].value;}}alert(sn);</script></head><body>用户名:<input style="border:0;border-bottom:1 solid black;background:;"><br/><br/>序列号:<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3"><input type="submit" name="Submit"><br/><br/>无框:<input style="background:transparent;border:1px solid #ffffff" value="123456"/><br/><br/>变色:<INPUT value="CHANGE COLOR" NAME="user_pass" TYPE="text" SIZE="29"onmouseover="this.style.borderColor='black';this.style.backgroundColor='plum'"onmouseout="this.style.borderColor='black';this.style.backgroundColor='#ffffff'"style="width:106;height:21;border-width:1px;border-color=black"><br/><br/>方形闪烁:<input type="text" id="oText" style="border:5px dotted red;color:red" onfocus="borderColor(this);" onblur="clearTimeout(oTime);"><br/><br/>向左延伸:<input type="text" onpropertychange="this.style.width=this.scrollWidth" value="abcdefghijk"><br/><br/>向下延伸:<textarea name="content" rows="6" cols="80" onpropertychange="if(this.scrollHeight>80) this.style.posHeight=this.scrollHeight+5">输入几个回车试试</textarea></body></html>