2012-11-09 来源:网络
【实例名称】
IP地址输入框JS脚本代码怎么写
【实例描述】
IP地址是一段很有规律的字符串,每三位用一个小数点隔开。本例通过此规律设置—个简便的IP地址输入框。
【实例代码】
<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页-学无忧(www.xue51.com)</title> <style> div.IPDiv{background:#ffffff; width:120;font-size:9pt;text-align:center; border:2 ridge threedshadow;border-right:inset threedhighlight; border-bottom:inset threedhighlight; } input.IPInput{width:24;font-size:9pt; text-align:center;border-width:0; } </style> <script language="javascript" for="document" event="onkeydown"> if(event.keyCode==13) //如果输入的是回车 event.keyCode=9; //转换为tab键 </script> <script language="javascript"> var tmpStr=[]; //创建一个数组 for(var i=0;i<4;i++) //通过循环-每隔3位,输出一个点 tmpStr[i]="<input class=IPInput name=IPInput type=text size=3 maxlength=3 onkeydown='if(event.srcElement.value.length==3||event.keyCode==39) event.keyCode=9'>"+(i==3?"":"."); document.write("<div class=IPDiv>"+tmpStr.join("")+"</div>"); //输出字符串 </script> </head> <body> </body> </html>
【运行效果】
【难点剖析】
本例的重点是通过一个循环语句输出4个标准的input文本控件。注意这4个文本控件没有边框,用一个div封装。同时还设置了这些文本框的“maxlength”属性,保证每个框内只能输入三个字符。
【源码下载】
为了JS代码的准确性,请点击:IP地址输入框JS代码 进行本实例源码下载