JS+CSS模拟IP输入框
代码如下
【
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html><head>
<title>测试</title>
<meta http-equiv="Content-type" content="text/html; charset=gb2312">
<meta http-equiv="pragma" content="no-cache">
<style type="text/css"><!--
.textiploghidden {
BORDER-RIGHT: 2px; BORDER-TOP: 2px; FONT-SIZE: 12px; BORDER-LEFT: 2px; WIDTH: 30px; COLOR: #ffffff; BORDER-BOTTOM: 2px; FONT-FAMILY: sans-serif; HEIGHT: 22px; border: 1 solid #000000
}
.textipinput {
BORDER-RIGHT: 0px; BORDER-TOP: 0px; FONT-SIZE: 11px; BORDER-LEFT: 0px; WIDTH: 30px; COLOR: #000000; BORDER-BOTTOM: 0px; FONT-FAMILY: sans-serif; HEIGHT: 19px; BACKGROUND-COLOR: #ffffff; TEXT-ALIGN: center
}
--></style>
<SCRIPT language=JavaScript1.2>
function checkIPValid_1()
{
if(event.shiftKey)
{
event.returnValue=false;
return;
}
var keyCode = parseInt(event.keyCode);
var result=true;
if((keyCode==8) || (keyCode==37) || (keyCode==39) || (keyCode==9)) return;
if((keyCode>=48) && (keyCode<=57)) return;
else result=false;
if((keyCode>=96) && (keyCode<=105)) return;
else result=false;
if((keyCode==110) || (keyCode==190) || (keyCode==32))
{
event.keyCode=9;
return;
}
if(result==false) event.returnValue=false;
}
function checkIPValid_2(formname,ip)
{
var form = eval("document."+formname)
var ip_1 = parseInt(eval("form."+ip+".value"));
if(ip_1>223)
{
eval("form."+ip).value="223";
alert(ip_1+"不是个有效项目，请指定一个介于1和223之间的数值");
}
else if(ip_1==127)
{
eval("form."+ip).value="1";
alert("以127开头的IP地址无效，因为它们保留用作环回地址，请在1和223之间指定一些其他有效值");
}
}
function checkIPValid_3(mask)
{
if(typeof(mask) != 'object'){
mask = eval(mask)
}
var maskInt=parseInt(mask.value);
if((maskInt<0) || (maskInt>255))
{
mask.value=255;
alert(maskInt+"不是个有效项目，请指定一个介于0和255之间的数值");
}
}
function checkIPValid_4(mask)
{
var maskInt=parseInt(mask.value);
if((maskInt<0) || (maskInt>32))
{
mask.value="";
alert("掩码错误，请指定一个介于0和32之间的数值");
}
}
function checkIPValid_5()
{
var keyCode = parseInt(event.keyCode);
var result=true;
if((keyCode==219) || (keyCode==221) || (keyCode==191) || (keyCode==220) || (keyCode==186) || (keyCode==32))
{
result=false;
}
if(result==false) event.returnValue=false;
}
</SCRIPT>
</head>
<body>
<form name=form1>
<table width="100%" border="1" cellpadding="4" cellspacing="2">
<tr>
<td colspan="2" align="right" style="padding-right:267;" ><table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="80" align="right" style="padding-right:3px;">IP地址：</td>
<td width="200" align="left" valign="bottom" ><table border="0" cellpadding="0" cellspacing="0" style="width:140px">
<tr>
<td width="50" align="center" valign="bottom"><input name="ip1" maxlength="3" value="" onKeyDown="checkIPValid_1()" onKeyUp="checkIPValid_2('form1','ip1')"/></td>
<td align="center" width="4" style="font-weight:bold;color=#000000">.</td>
<td width="50" align="center" valign="bottom"><input name="ip2" maxlength="3" value="" onKeyDown="checkIPValid_1()" onKeyUp="checkIPValid_3(eval('document.form1.ip2'))"/></td>
<td align="center" width="4" style="font-weight:bold;color=#000000">.</td>
<td width="50" align="center" valign="bottom"><input name="ip3" maxlength="3" value="" onKeyDown="checkIPValid_1()" onKeyUp="checkIPValid_3(eval('document.form1.ip3'))"/></td>
<td align="center" width="4" style="font-weight:bold;color=#000000">.</td>
<td width="50" align="center" valign="bottom"><input name="ip4" maxlength="3" value="" onKeyDown="checkIPValid_1()" onKeyUp="checkIPValid_3(eval('document.form1.ip4'))"/></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
</form>
</body>
</html>
】