IP地址输入栏
时间:2007-02-18 来源:PHP爱好者
提示:您可以先修改部分代码再运行 <html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>IP-like Input-php爱好者_[url]www.phpfans.net[/url]</title>
<style>
<!--
v:* { behavior: url(#default#VML) }
div.IPDiv { background: #FFFFFF; width: 120; margin:0; font-family: Arial,Tahoma; font-size: 10pt; text-align: center; border-top: 2 ridge threedshadow; border-left: 2 ridge threedshadow; border-right: 2 inset threedhighlight; border-bottom: 2 inset threedhighlight }
input.IPInput { width: 24; margin:0; font-family: Arial,Tahoma; font-size: 10pt; text-align: center; border-width: 0 }
-->
</style>
</head>
<body bgcolor=threedface>
<div id="alertInfoDiv" style="position: absolute; left:100; top:40; display:none">
<v:roundrect strokecolor="black" fillcolor="infobackground" style="position:relative;left:30;top:5;width:130px;z-index:9">
<v:shadow on="t" type="single" color="silver" offset="3pt,-3pt"></v:shadow>
<v:textbox id="alertInfo" style="font-family:Arial,Tahoma;font-size:10pt;color:infotext;line-</v:textbox>
</v:roundrect>
<v:oval strokecolor="black" fillcolor="infobackground" style="position:relative;left:-120;top:20;width:14px;z-index:8">
<v:shadow on="t" type="single" color="silver" offset="3pt,-3pt"></v:shadow>
</v:oval>
<v:oval strokecolor="black" fillcolor="infobackground" style="position:relative;left:-160;top:32;width:10px;Z-index:7">
<v:shadow on="t" type="single" color="silver" offset="3pt,-3pt"></v:shadow>
</v:oval>
</div>
IP地址输入栏:
<div style="position: absolute; left: 50; top:115; text-align: center; vertical-align: middle;">
<script>
IPlikeInputStr = "";
IPlikeInputStr += '<div class="IPDiv">';
for (i=0;i<4;i++) {
IPlikeInputStr += '<input class="IPInput" name="IPInput'+i+'" type="text" size="3" maxlength="3" onkeypress="keyHandle()" onkeyup="checkInput()">'+((i==3) ? '' : '.');
}
IPlikeInputStr += '</div>';
document.write(IPlikeInputStr);
function keyHandle() {
if (event.keyCode<48||event.keyCode>57) {
event.returnValue = false;
}
}
function checkInput() {
if (event.srcElement.name=="IPInput0") {
if (event.srcElement.value==0&&event.srcElement.value.length==3) {
event.srcElement.value="1";
VMLAlert("请输入一个界于1和223之间的数值。",67);
//alert("请输入一个界于1和223之间的数值。");
event.srcElement.select();
}
if (event.srcElement.value>223) {
event.srcElement.value="223";
VMLAlert("请输入一个界于1和223之间的数值。",67);
//alert("请输入一个界于1和223之间的数值。");
event.srcElement.select();
}
}
else {
if (event.srcElement.value>255) {
event.srcElement.value="255";
var theSrcName = event.srcElement.name;
var theAlertPos = theSrcName=="IPInput1" ? 95 : (theSrcName=="IPInput2" ? 122 :150);
VMLAlert("请输入一个界于0和255之间的数值。",theAlertPos);
//alert("请输入一个界于0和255之间的数值。")
event.srcElement.select();
}
}
}
function VMLAlert(alertText,alertPos) {
with (document.all) {
alertInfo.innerHTML = alertText;
alertInfoDiv.style.left = alertPos;
alertInfoDiv.style.display = "";
}
setTimeout('document.all.alertInfoDiv.style.display = "none"',3000);
}
</script>
</div>
</body>
</html>
提示:您可以先修改部分代码再运行
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>IP-like Input-php爱好者_[url]www.phpfans.net[/url]</title>
<style>
<!--
v:* { behavior: url(#default#VML) }
div.IPDiv { background: #FFFFFF; width: 120; margin:0; font-family: Arial,Tahoma; font-size: 10pt; text-align: center; border-top: 2 ridge threedshadow; border-left: 2 ridge threedshadow; border-right: 2 inset threedhighlight; border-bottom: 2 inset threedhighlight }
input.IPInput { width: 24; margin:0; font-family: Arial,Tahoma; font-size: 10pt; text-align: center; border-width: 0 }
-->
</style>
</head>
<body bgcolor=threedface>
<div id="alertInfoDiv" style="position: absolute; left:100; top:40; display:none">
<v:roundrect strokecolor="black" fillcolor="infobackground" style="position:relative;left:30;top:5;width:130px;z-index:9">
<v:shadow on="t" type="single" color="silver" offset="3pt,-3pt"></v:shadow>
<v:textbox id="alertInfo" style="font-family:Arial,Tahoma;font-size:10pt;color:infotext;line-</v:textbox>
</v:roundrect>
<v:oval strokecolor="black" fillcolor="infobackground" style="position:relative;left:-120;top:20;width:14px;z-index:8">
<v:shadow on="t" type="single" color="silver" offset="3pt,-3pt"></v:shadow>
</v:oval>
<v:oval strokecolor="black" fillcolor="infobackground" style="position:relative;left:-160;top:32;width:10px;Z-index:7">
<v:shadow on="t" type="single" color="silver" offset="3pt,-3pt"></v:shadow>
</v:oval>
</div>
IP地址输入栏:
<div style="position: absolute; left: 50; top:115; text-align: center; vertical-align: middle;">
<script>
IPlikeInputStr = "";
IPlikeInputStr += '<div class="IPDiv">';
for (i=0;i<4;i++) {
IPlikeInputStr += '<input class="IPInput" name="IPInput'+i+'" type="text" size="3" maxlength="3" onkeypress="keyHandle()" onkeyup="checkInput()">'+((i==3) ? '' : '.');
}
IPlikeInputStr += '</div>';
document.write(IPlikeInputStr);
function keyHandle() {
if (event.keyCode<48||event.keyCode>57) {
event.returnValue = false;
}
}
function checkInput() {
if (event.srcElement.name=="IPInput0") {
if (event.srcElement.value==0&&event.srcElement.value.length==3) {
event.srcElement.value="1";
VMLAlert("请输入一个界于1和223之间的数值。",67);
//alert("请输入一个界于1和223之间的数值。");
event.srcElement.select();
}
if (event.srcElement.value>223) {
event.srcElement.value="223";
VMLAlert("请输入一个界于1和223之间的数值。",67);
//alert("请输入一个界于1和223之间的数值。");
event.srcElement.select();
}
}
else {
if (event.srcElement.value>255) {
event.srcElement.value="255";
var theSrcName = event.srcElement.name;
var theAlertPos = theSrcName=="IPInput1" ? 95 : (theSrcName=="IPInput2" ? 122 :150);
VMLAlert("请输入一个界于0和255之间的数值。",theAlertPos);
//alert("请输入一个界于0和255之间的数值。")
event.srcElement.select();
}
}
}
function VMLAlert(alertText,alertPos) {
with (document.all) {
alertInfo.innerHTML = alertText;
alertInfoDiv.style.left = alertPos;
alertInfoDiv.style.display = "";
}
setTimeout('document.all.alertInfoDiv.style.display = "none"',3000);
}
</script>
</div>
</body>
</html>
提示:您可以先修改部分代码再运行
相关阅读 更多 +