日韩欧美国产精品免费一二-日韩欧美国产精品亚洲二区-日韩欧美国产精品专区-日韩欧美国产另-日韩欧美国产免费看-日韩欧美国产免费看清风阁

LOGO OA教程 ERP教程 模切知識(shí)交流 PMS教程 CRM教程 開(kāi)發(fā)文檔 其他文檔  
 
網(wǎng)站管理員

javascript IP地址控件和MAC地址控件

admin
2011年2月26日 9:56 本文熱度 3462
IP控件代碼:

 view plaincopy to clipboardprint?
<html>  
<head>  
<mce:script ><!--  
/** 
* by Li Shangjin. 
* [url]http://www.13j.cn[/url] 
**/ 
function IpV4Box(id,pNode){  
this.id = id;  
this.onChange=new Function();  
this.onEnterKey=new Function();  
this.disabled=false;  
IpV4Box.all[id]=this;  
if(pNode)  
{  
if(typeof pNode=="string")  
{  
pNode=document.getElementById(pNode);  
}  
pNode.innerHTML=this.toString();  
}  
}  
IpV4Box.all={};  
IpV4Box.EnabledClassName="ipInput oneInput";//啟用時(shí)樣式  
IpV4Box.DisabledClassName="ipInput oneInputDisabled";// 禁用時(shí)樣式  
IpV4Box.prototype={  
/** 
* 激活I(lǐng)P框 
* @param {number} index 1-4 指定激活的位置 
*/ 
focus:function(index){  
if(!index)  
index=1;  
document.getElementById(this.id+"_"+index).focus();  
},  
setEnable:function(bEnable){  
var b=!bEnable;  
this.disabled=!bEnable;  
var boxes=document.getElementById(this.id).getElementsByTagName("input");  
for(var i=0;i<boxes.length;i++)  
{  
boxes.readOnly=b;  
}  
document.getElementById(this.id).className=bEnable?IpV4Box.EnabledClassName:IpV4Box.DisabledClassName  
},  
toString:function(){  
return '<span  id="'+this.id+'" class="' + IpV4Box.EnabledClassName + '"  >\  
<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_1" maxlength=3\  
/>.<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_2" maxlength=3\  
/>.<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_3" maxlength=3\  
/>.<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_4" maxlength=3/>\  
</span>';  
},  
getValue:function(){  
var ip=[  
document.getElementById(this.id+"_1").value,  
document.getElementById(this.id+"_2").value,  
document.getElementById(this.id+"_3").value,  
document.getElementById(this.id+"_4").value  
];  
return ip.join(".");  
},  
setValue:function(ip){  
ip=ip.replace(/[^\d.]/g,"");  
if(ip=="")  
{  
ip="..." 
}  
ip=ip.split(".");  
document.getElementById(this.id+"_1").value = ip[0];  
document.getElementById(this.id+"_2").value = ip[1];  
document.getElementById(this.id+"_3").value = ip[2];  
document.getElementById(this.id+"_4").value = ip[3];  
}  
}  
IpV4Box.evt={  
focus:function(obj,evt){  
obj.select();  
},  
change:function(obj,evt){  
var v=parseInt(obj.value);  
if( v >= 0 && v <= 255 )  
{  
if(v != obj.value)  
obj.value=v;  
}  
else{  
obj.value="";  
}  
IpV4Box.all[ obj.id.replace(/_\d$/,"") ].onChange();  
},  
keypress:function(obj,evt){  
var key=evt.charCode||evt.keyCode;  
var pos=IpV4Box.evt.getSelection(obj);  
var value=obj.value;  
var c=String.fromCharCode(key);  
if(key>=48 && key<=57)  
{  
value=""+value.substring(0,pos.start)  
+ c + value.substring(pos.end,value.length);  
if(parseInt(value)<255)  
{  
var id=obj.id;  
/(.*)_(\d)$/.test(id);  
var index=RegExp.$2;  
IP_id=RegExp.$1;  
if(parseInt(value)>=100)  
{  
if(parseInt(index)<4)  
{  
id=id.replace(/(\d)$/,parseInt(index)+1 );  
setTimeout("document.getElementById('"+id+"').focus();"+  
"document.getElementById('"+id+"').select();",200);  
}  
}  
setTimeout("IpV4Box.all['"+IP_id+"'].onChange()",0);  
return true;  
}  
else 
{  
if(evt.preventDefault)  
evt.preventDefault();  
evt.returnValue=false;  
return false;  
}  
}  
else{  
if(evt.preventDefault)  
evt.preventDefault();  
evt.returnValue=false;  
}  
},  
keydown:function(obj,evt){  
var key=evt.charCode||evt.keyCode;  
var pos=IpV4Box.evt.getSelection(obj);  
var value=obj.value;  
var c=String.fromCharCode(key);  
var id=obj.id;  
/^(.*)_(\d)$/.test(id);  
var index=RegExp.$2;  
var Ip_Id=RegExp.$1;  
switch(key)  
{  
case 13://回車(chē)  
IpV4Box.all[Ip_Id].onEnterKey();  
break;  
case 110://.小鍵盤(pán)  
case 190://.主鍵盤(pán)  
if(index<4)  
{  
id=id.replace(/(\d)$/,parseInt(index)+1 );  
document.getElementById(id).focus();  
document.getElementById(id).select();  
}  
break;  
case 38://up  
value=!isNaN(parseInt(value))?parseInt(value):"";  
if(value=="")  
value=0;  
if(value<255)  
{  
obj.value=value+1;  
}  
else 
obj.value=0;  
break;  
case 40://down  
value=!isNaN(parseInt(value))?parseInt(value):"";  
if(value=="")  
value=255;  
if(value>0)  
{  
obj.value=value-1;  
};  
break;  
case 8://backspace  
if(pos.start>0)  
return;  
case 37://left  
if(pos.end==0 && index>1)  
{  
id=id.replace(/(\d)$/,parseInt(index)-1 );  
document.getElementById(id).focus();  
document.getElementById(id).select();  
}  
break;  
case 39://right  
if(pos.start==value.length && index<4)  
{  
id=id.replace(/(\d)$/,parseInt(index)+1 );  
document.getElementById(id).focus();  
document.getElementById(id).select();  
}  
break;  
}  
},  
//獲取選區(qū)位置  
getSelection:function(oInput){  
var T=this;  
if(oInput.createTextRange){  
var s=document.selection.createRange().duplicate();  
s.moveStart("character",-oInput.value.length);  
var p1=s.text.length;  
var s=document.selection.createRange().duplicate();  
s.moveEnd("character",oInput.value.length);  
var p2=oInput.value.lastIndexOf(s.text);  
if(s.text=="")p2=oInput.value.length;  
return {start:p2,end:p1};  
}else {  
return {start:oInput.selectionStart,end:oInput.selectionEnd};  
}  
}  
}  
// --></mce:script>  
<mce:style type="text/css"><!--  
/*IP 輸入框*/ 
.ipInput{  
border:1px solid #ccc;  
  
}  
.ipInput input{  
border:0px solid #ccc;  
  
height:16px;  
width:24px;  
background:transparent;  
text-align:center;  
}  
--></mce:style><style type="text/css" mce_bogus="1">/*IP 輸入框*/ 
.ipInput{  
border:1px solid #ccc;  
  
}  
.ipInput input{  
border:0px solid #ccc;  
  
height:16px;  
width:24px;  
background:transparent;  
text-align:center;  
}</style>  
</head>  
<body>  
<span id="span1"></span>  
<input type="button" value="ip1.getValue" onclick="alert(ip1.getValue())" />  
<p>  
<span id="span2"></span>  
<mce:script type="text/javascript"><!--  
var ip1=new IpV4Box("ip1");  
document.getElementById("span1").innerHTML=ip1;  
ip1.focus(1);//激活輸入框的第一部分  
ip1.onEnterKey=function(){  
alert("ip1 EnterKey");  
}  
//每成功輸入一個(gè)字每都會(huì)激發(fā)onChange事件  
ip1.onChange=function(){  
window.status="ip1 新ip:"+(this.getValue());  
}  
ip1.setValue("195.2.199.170");  
var ip2=new IpV4Box("ip2" , "span2");  
// --></mce:script>  
</body>  
</html> 
<html>
<head>
<mce:script ><!--
/**
* by Li Shangjin.
* [url]http://www.13j.cn[/url]
**/
function IpV4Box(id,pNode){
this.id = id;
this.onChange=new Function();
this.onEnterKey=new Function();
this.disabled=false;
IpV4Box.all[id]=this;
if(pNode)
{
if(typeof pNode=="string")
{
pNode=document.getElementById(pNode);
}
pNode.innerHTML=this.toString();
}
}
IpV4Box.all={};
IpV4Box.EnabledClassName="ipInput oneInput";//啟用時(shí)樣式
IpV4Box.DisabledClassName="ipInput oneInputDisabled";// 禁用時(shí)樣式
IpV4Box.prototype={
/**
* 激活I(lǐng)P框
* @param {number} index 1-4 指定激活的位置
*/
focus:function(index){
if(!index)
index=1;
document.getElementById(this.id+"_"+index).focus();
},
setEnable:function(bEnable){
var b=!bEnable;
this.disabled=!bEnable;
var boxes=document.getElementById(this.id).getElementsByTagName("input");
for(var i=0;i<boxes.length;i++)
{
boxes.readOnly=b;
}
document.getElementById(this.id).className=bEnable?IpV4Box.EnabledClassName:IpV4Box.DisabledClassName
},
toString:function(){
return '<span  id="'+this.id+'" class="' + IpV4Box.EnabledClassName + '"  >\
<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_1" maxlength=3\
/>.<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_2" maxlength=3\
/>.<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_3" maxlength=3\
/>.<input onkeypress="IpV4Box.evt.keypress(this,event)" onkeydown="IpV4Box.evt.keydown(this,event)" onfocus="IpV4Box.evt.focus(this,event)" onpaste="IpV4Box.evt.change(this,event);" oninput="IpV4Box.evt.change(this,event);" onchange="IpV4Box.evt.change(this,event);"  type="text" size=3  id="'+this.id+'_4" maxlength=3/>\
</span>';
},
getValue:function(){
var ip=[
document.getElementById(this.id+"_1").value,
document.getElementById(this.id+"_2").value,
document.getElementById(this.id+"_3").value,
document.getElementById(this.id+"_4").value
];
return ip.join(".");
},
setValue:function(ip){
ip=ip.replace(/[^\d.]/g,"");
if(ip=="")
{
ip="..."
}
ip=ip.split(".");
document.getElementById(this.id+"_1").value = ip[0];
document.getElementById(this.id+"_2").value = ip[1];
document.getElementById(this.id+"_3").value = ip[2];
document.getElementById(this.id+"_4").value = ip[3];
}
}
IpV4Box.evt={
focus:function(obj,evt){
obj.select();
},
change:function(obj,evt){
var v=parseInt(obj.value);
if( v >= 0 && v <= 255 )
{
if(v != obj.value)
obj.value=v;
}
else{
obj.value="";
}
IpV4Box.all[ obj.id.replace(/_\d$/,"") ].onChange();
},
keypress:function(obj,evt){
var key=evt.charCode||evt.keyCode;
var pos=IpV4Box.evt.getSelection(obj);
var value=obj.value;
var c=String.fromCharCode(key);
if(key>=48 && key<=57)
{
value=""+value.substring(0,pos.start)
+ c + value.substring(pos.end,value.length);
if(parseInt(value)<255)
{
var id=obj.id;
/(.*)_(\d)$/.test(id);
var index=RegExp.$2;
IP_id=RegExp.$1;
if(parseInt(value)>=100)
{
if(parseInt(index)<4)
{
id=id.replace(/(\d)$/,parseInt(index)+1 );
setTimeout("document.getElementById('"+id+"').focus();"+
"document.getElementById('"+id+"').select();",200);
}
}
setTimeout("IpV4Box.all['"+IP_id+"'].onChange()",0);
return true;
}
else
{
if(evt.preventDefault)
evt.preventDefault();
evt.returnValue=false;
return false;
}
}
else{
if(evt.preventDefault)
evt.preventDefault();
evt.returnValue=false;
}
},
keydown:function(obj,evt){
var key=evt.charCode||evt.keyCode;
var pos=IpV4Box.evt.getSelection(obj);
var value=obj.value;
var c=String.fromCharCode(key);
var id=obj.id;
/^(.*)_(\d)$/.test(id);
var index=RegExp.$2;
var Ip_Id=RegExp.$1;
switch(key)
{
case 13://回車(chē)
IpV4Box.all[Ip_Id].onEnterKey();
break;
case 110://.小鍵盤(pán)
case 190://.主鍵盤(pán)
if(index<4)
{
id=id.replace(/(\d)$/,parseInt(index)+1 );
document.getElementById(id).focus();
document.getElementById(id).select();
}
break;
case 38://up
value=!isNaN(parseInt(value))?parseInt(value):"";
if(value=="")
value=0;
if(value<255)
{
obj.value=value+1;
}
else
obj.value=0;
break;
case 40://down
value=!isNaN(parseInt(value))?parseInt(value):"";
if(value=="")
value=255;
if(value>0)
{
obj.value=value-1;
};
break;
case 8://backspace
if(pos.start>0)
return;
case 37://left
if(pos.end==0 && index>1)
{
id=id.replace(/(\d)$/,parseInt(index)-1 );
document.getElementById(id).focus();
document.getElementById(id).select();
}
break;
case 39://right
if(pos.start==value.length && index<4)
{
id=id.replace(/(\d)$/,parseInt(index)+1 );
document.getElementById(id).focus();
document.getElementById(id).select();
}
break;
}
},
//獲取選區(qū)位置
getSelection:function(oInput){
var T=this;
if(oInput.createTextRange){
var s=document.selection.createRange().duplicate();
s.moveStart("character",-oInput.value.length);
var p1=s.text.length;
var s=document.selection.createRange().duplicate();
s.moveEnd("character",oInput.value.length);
var p2=oInput.value.lastIndexOf(s.text);
if(s.text=="")p2=oInput.value.length;
return {start:p2,end:p1};
}else {
return {start:oInput.selectionStart,end:oInput.selectionEnd};
}
}
}
// --></mce:script>
<mce:style type="text/css"><!--
/*IP 輸入框*/
.ipInput{
border:1px solid #ccc;

}
.ipInput input{
border:0px solid #ccc;

height:16px;
width:24px;
background:transparent;
text-align:center;
}
--></mce:style><style type="text/css" mce_bogus="1">/*IP 輸入框*/
.ipInput{
border:1px solid #ccc;

}
.ipInput input{
border:0px solid #ccc;

height:16px;
width:24px;
background:transparent;
text-align:center;
}</style>
</head>
<body>
<span id="span1"></span>
<input type="button" value="ip1.getValue" onclick="alert(ip1.getValue())" />
<p>
<span id="span2"></span>
<mce:script type="text/javascript"><!--
var ip1=new IpV4Box("ip1");
document.getElementById("span1").innerHTML=ip1;
ip1.focus(1);//激活輸入框的第一部分
ip1.onEnterKey=function(){
alert("ip1 EnterKey");
}
//每成功輸入一個(gè)字每都會(huì)激發(fā)onChange事件
ip1.onChange=function(){
window.status="ip1 新ip:"+(this.getValue());
}
ip1.setValue("195.2.199.170");
var ip2=new IpV4Box("ip2" , "span2");
// --></mce:script>
</body>
</html>

 


MAC地址控件代碼:

 view plaincopy to clipboardprint?
<html>  
<head>  
<mce:script ><!--  
/** 
* by wirror800 
**/ 
function MacBox(id,pNode){  
    this.id = id;  
    this.onChange=new Function();  
    this.onEnterKey=new Function();  
    this.disabled=false;  
    MacBox.all[id]=this;  
    if(pNode)  
    {  
        if(typeof pNode=="string")  
        {  
            pNode=document.getElementById(pNode);  
        }  
        pNode.innerHTML=this.toString();  
    }  
}  
MacBox.all={};  
MacBox.EnabledClassName="macInput oneInput";//啟用時(shí)樣式  
MacBox.DisabledClassName="macInput oneInputDisabled";// 禁用時(shí)樣式  
MacBox.prototype={  
/** 
* 激活MAC框 
* @param {number} index 1-6 指定激活的位置 
*/ 
focus:function(index){  
    if(!index)  
        index=1;  
    document.getElementById(this.id+"_"+index).focus();  
},  
setEnable:function(bEnable){  
    var b=!bEnable;  
    this.disabled=!bEnable;  
    var boxes=document.getElementById(this.id).getElementsByTagName("input");  
    for(var i=0;i<boxes.length;i++)  
    {  
        boxes.readOnly=b;  
    }  
    document.getElementById(this.id).className=bEnable?MacBox.EnabledClassName:MacBox.DisabledClassName  
},  
toString:function(){  
return '<span  id="'+this.id+'" class="' + MacBox.EnabledClassName + '"  >\  
<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_1" maxlength=2\  
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_2" maxlength=2\  
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_3" maxlength=2\  
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_4" maxlength=2\  
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_5" maxlength=2\  
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_6" maxlength=2/>\  
</span>';  
},  
getValue:function(){  
    var mac=[  
    document.getElementById(this.id+"_1").value,  
    document.getElementById(this.id+"_2").value,  
    document.getElementById(this.id+"_3").value,  
    document.getElementById(this.id+"_4").value,  
    document.getElementById(this.id+"_5").value,  
    document.getElementById(this.id+"_6").value  
    ];  
    return mac.join(":");  
},  
setValue:function(mac){  
    mac=mac.replace(/[^[a-f0-9]:]/g,"");  
    if(mac=="")  
    {  
        mac=":::::" 
    }  
    mac=mac.split(":");  
    document.getElementById(this.id+"_1").value = mac[0];  
    document.getElementById(this.id+"_2").value = mac[1];  
    document.getElementById(this.id+"_3").value = mac[2];  
    document.getElementById(this.id+"_4").value = mac[3];  
    document.getElementById(this.id+"_5").value = mac[4];  
    document.getElementById(this.id+"_6").value = mac[5];  
    }  
}  
MacBox.evt={  
focus:function(obj,evt){  
    obj.select();  
},  
change:function(obj,evt){  
    var v = obj.value;  
    var reghex = new RegExp("(^[a-f0-9]{1,2}$)|(^[A-F0-9]{1,2}$)");  
    if(reghex.exec(v)!==null){  
        if(v != obj.value)  
            obj.value=v;  
    }  
    else{  
        obj.value="";  
    }  
    MacBox.all[ obj.id.replace(/_\d$/,"") ].onChange();  
},  
keypress:function(obj,evt){  
    var key=evt.charCode||evt.keyCode;  
    var pos=MacBox.evt.getSelection(obj);  
    var value=obj.value;  
    var c=String.fromCharCode(key);  
    if((key>=48 && key<=57)||(key>=65 && key<=70)||(key>=97 && key<=102))  
    {  
        value=""+value.substring(0,pos.start)+ c + value.substring(pos.end,value.length);  
        var reghex = new RegExp("(^[a-f0-9]{1,2}$)|(^[A-F0-9]{1,2}$)");  
        if(reghex.exec(value)!==null)  
        {  
            var id=obj.id;  
            /(.*)_(\d)$/.test(id);  
            var index=RegExp.$2;  
            MAC_id=RegExp.$1;  
            if(value.length>1)  
            {  
                if(parseInt(index)<6)  
                {  
                    id=id.replace(/(\d)$/,parseInt(index)+1 );  
                    setTimeout("document.getElementById('"+id+"').focus();"+"document.getElementById('"+id+"').select();",200);  
                }  
            }  
            setTimeout("MacBox.all['"+MAC_id+"'].onChange()",0);  
            return true;  
        }  
        else 
        {  
            if(evt.preventDefault)  
                evt.preventDefault();  
            evt.returnValue=false;  
            return false;  
        }  
    }  
    else{  
        if(evt.preventDefault)  
            evt.preventDefault();  
        evt.returnValue=false;  
    }  
},  
keydown:function(obj,evt){  
    var key=evt.charCode||evt.keyCode;  
    var pos=MacBox.evt.getSelection(obj);  
    var value=obj.value;  
    var c=String.fromCharCode(key);  
    var id=obj.id;  
    /^(.*)_(\d)$/.test(id);  
    var index=RegExp.$2;  
    var MAC_id=RegExp.$1;  
    var reghexUpcase = new RegExp("(^[A-F0-9]{1,2}$)");  
    var isUpcase;//默認(rèn)情況下,數(shù)字屬于大寫(xiě)  
    if(reghexUpcase.exec(value)!==null)  
        isUpcase = true;  
    else 
        isUpcase = false;  
    switch(key)  
    {  
    case 13://回車(chē)  
        MacBox.all[MAC_id].onEnterKey();  
        break;  
    case 110://.小鍵盤(pán)  
    case 190://.主鍵盤(pán)  
        if(index<6)  
        {  
            id=id.replace(/(\d)$/,parseInt(index)+1 );  
            document.getElementById(id).focus();  
            document.getElementById(id).select();  
        }  
        break;  
    case 38://up自加  
        //value=!isNaN(parseInt(value))?parseInt(value):"";  
        if(value=="")  
            value=0;  
        if(parseInt(value,16)<parseInt("FF",16))  
        {  
            if(isUpcase){  
                obj.value=(parseInt(value,16)+1).toString(16).toUpperCase();  
            }else{  
                obj.value=(parseInt(value,16)+1).toString(16);  
            }  
        }  
        else 
            obj.value=0;  
        break;  
    case 40://down自減  
        //value=!isNaN(parseInt(value))?parseInt(value):"";  
        if(value=="")  
            value="FF";  
        if(parseInt(value,16)>0)  
        {  
            if(isUpcase){  
                obj.value=(parseInt(value,16)-1).toString(16).toUpperCase();  
            }else{  
                obj.value=(parseInt(value,16)-1).toString(16);  
            }  
        };  
        break;  
    case 8://backspace  
        if(pos.start>0)  
            return;  
    case 37://left  
        if(pos.end==0 && index>1)  
        {  
            id=id.replace(/(\d)$/,parseInt(index)-1 );  
            document.getElementById(id).focus();  
            document.getElementById(id).select();  
        }  
        break;  
    case 39://right  
        if(pos.start==value.length && index<6)  
        {  
            id=id.replace(/(\d)$/,parseInt(index)+1 );  
            document.getElementById(id).focus();  
            document.getElementById(id).select();  
        }  
        break;  
    }  
},  
//獲取選區(qū)位置  
getSelection:function(oInput){  
    var T=this;  
    if(oInput.createTextRange){  
        var s=document.selection.createRange().duplicate();  
        s.moveStart("character",-oInput.value.length);  
        var p1=s.text.length;  
        var s=document.selection.createRange().duplicate();  
        s.moveEnd("character",oInput.value.length);  
        var p2=oInput.value.lastIndexOf(s.text);  
        if(s.text=="")p2=oInput.value.length;  
            return {start:p2,end:p1};  
        }else {  
            return {start:oInput.selectionStart,end:oInput.selectionEnd};  
        }  
    }  
}  
// --></mce:script>  
<mce:style type="text/css"><!--  
/*IP 輸入框*/ 
.macInput{  
border:1px solid #ccc;  
  
}  
.macInput input{  
border:0px solid #ccc;  
  
height:16px;  
width:24px;  
background:transparent;  
text-align:center;  
}  
--></mce:style><style type="text/css" mce_bogus="1">/*IP 輸入框*/ 
.macInput{  
border:1px solid #ccc;  
  
}  
.macInput input{  
border:0px solid #ccc;  
  
height:16px;  
width:24px;  
background:transparent;  
text-align:center;  
}</style>  
</head>  
<body>  
<span id="span1"></span>  
<input type="button" value="mac1.getValue" onClick="alert(mac1.getValue())" />  
<p>  
<span id="span2"></span>  
<mce:script type="text/javascript"><!--  
var mac1=new MacBox("mac1");  
document.getElementById("span1").innerHTML=mac1;  
mac1.focus(1);//激活輸入框的第一部分  
mac1.onEnterKey=function(){  
alert("mac1 EnterKey");  
}  
//每成功輸入一個(gè)字每都會(huì)激發(fā)onChange事件  
mac1.onChange=function(){  
window.status="mac1 新mac:"+(this.getValue());  
}  
mac1.setValue("EF:00:34:3A:11:B2");  
var mac2=new MacBox("mac2" , "span2");  
// --></mce:script>  
</body>  
</html> 
<html>
<head>
<mce:script ><!--
/**
* by wirror800
**/
function MacBox(id,pNode){
 this.id = id;
 this.onChange=new Function();
 this.onEnterKey=new Function();
 this.disabled=false;
 MacBox.all[id]=this;
 if(pNode)
 {
  if(typeof pNode=="string")
  {
   pNode=document.getElementById(pNode);
  }
  pNode.innerHTML=this.toString();
 }
}
MacBox.all={};
MacBox.EnabledClassName="macInput oneInput";//啟用時(shí)樣式
MacBox.DisabledClassName="macInput oneInputDisabled";// 禁用時(shí)樣式
MacBox.prototype={
/**
* 激活MAC框
* @param {number} index 1-6 指定激活的位置
*/
focus:function(index){
 if(!index)
  index=1;
 document.getElementById(this.id+"_"+index).focus();
},
setEnable:function(bEnable){
 var b=!bEnable;
 this.disabled=!bEnable;
 var boxes=document.getElementById(this.id).getElementsByTagName("input");
 for(var i=0;i<boxes.length;i++)
 {
  boxes.readOnly=b;
 }
 document.getElementById(this.id).className=bEnable?MacBox.EnabledClassName:MacBox.DisabledClassName
},
toString:function(){
return '<span  id="'+this.id+'" class="' + MacBox.EnabledClassName + '"  >\
<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_1" maxlength=2\
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_2" maxlength=2\
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_3" maxlength=2\
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_4" maxlength=2\
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_5" maxlength=2\
/>:<input onkeypress="MacBox.evt.keypress(this,event)" onkeydown="MacBox.evt.keydown(this,event)" onfocus="MacBox.evt.focus(this,event)" onpaste="MacBox.evt.change(this,event);" oninput="MacBox.evt.change(this,event);" onchange="MacBox.evt.change(this,event);"  type="text" size=2  id="'+this.id+'_6" maxlength=2/>\
</span>';
},
getValue:function(){
 var mac=[
 document.getElementById(this.id+"_1").value,
 document.getElementById(this.id+"_2").value,
 document.getElementById(this.id+"_3").value,
 document.getElementById(this.id+"_4").value,
 document.getElementById(this.id+"_5").value,
 document.getElementById(this.id+"_6").value
 ];
 return mac.join(":");
},
setValue:function(mac){
 mac=mac.replace(/[^[a-f0-9]:]/g,"");
 if(mac=="")
 {
  mac=":::::"
 }
 mac=mac.split(":");
 document.getElementById(this.id+"_1").value = mac[0];
 document.getElementById(this.id+"_2").value = mac[1];
 document.getElementById(this.id+"_3").value = mac[2];
 document.getElementById(this.id+"_4").value = mac[3];
 document.getElementById(this.id+"_5").value = mac[4];
 document.getElementById(this.id+"_6").value = mac[5];
 }
}
MacBox.evt={
focus:function(obj,evt){
 obj.select();
},
change:function(obj,evt){
 var v = obj.value;
 var reghex = new RegExp("(^[a-f0-9]{1,2}$)|(^[A-F0-9]{1,2}$)");
 if(reghex.exec(v)!==null){
  if(v != obj.value)
   obj.value=v;
 }
 else{
  obj.value="";
 }
 MacBox.all[ obj.id.replace(/_\d$/,"") ].onChange();
},
keypress:function(obj,evt){
 var key=evt.charCode||evt.keyCode;
 var pos=MacBox.evt.getSelection(obj);
 var value=obj.value;
 var c=String.fromCharCode(key);
 if((key>=48 && key<=57)||(key>=65 && key<=70)||(key>=97 && key<=102))
 {
  value=""+value.substring(0,pos.start)+ c + value.substring(pos.end,value.length);
  var reghex = new RegExp("(^[a-f0-9]{1,2}$)|(^[A-F0-9]{1,2}$)");
  if(reghex.exec(value)!==null)
  {
   var id=obj.id;
   /(.*)_(\d)$/.test(id);
   var index=RegExp.$2;
   MAC_id=RegExp.$1;
   if(value.length>1)
   {
    if(parseInt(index)<6)
    {
     id=id.replace(/(\d)$/,parseInt(index)+1 );
     setTimeout("document.getElementById('"+id+"').focus();"+"document.getElementById('"+id+"').select();",200);
    }
   }
   setTimeout("MacBox.all['"+MAC_id+"'].onChange()",0);
   return true;
  }
  else
  {
   if(evt.preventDefault)
    evt.preventDefault();
   evt.returnValue=false;
   return false;
  }
 }
 else{
  if(evt.preventDefault)
   evt.preventDefault();
  evt.returnValue=false;
 }
},
keydown:function(obj,evt){
 var key=evt.charCode||evt.keyCode;
 var pos=MacBox.evt.getSelection(obj);
 var value=obj.value;
 var c=String.fromCharCode(key);
 var id=obj.id;
 /^(.*)_(\d)$/.test(id);
 var index=RegExp.$2;
 var MAC_id=RegExp.$1;
 var reghexUpcase = new RegExp("(^[A-F0-9]{1,2}$)");
 var isUpcase;//默認(rèn)情況下,數(shù)字屬于大寫(xiě)
 if(reghexUpcase.exec(value)!==null)
  isUpcase = true;
 else
     isUpcase = false;
 switch(key)
 {
 case 13://回車(chē)
  MacBox.all[MAC_id].onEnterKey();
  break;
 case 110://.小鍵盤(pán)
 case 190://.主鍵盤(pán)
  if(index<6)
  {
   id=id.replace(/(\d)$/,parseInt(index)+1 );
   document.getElementById(id).focus();
   document.getElementById(id).select();
  }
  break;
 case 38://up自加
  //value=!isNaN(parseInt(value))?parseInt(value):"";
  if(value=="")
   value=0;
  if(parseInt(value,16)<parseInt("FF",16))
  {
      if(isUpcase){
    obj.value=(parseInt(value,16)+1).toString(16).toUpperCase();
   }else{
    obj.value=(parseInt(value,16)+1).toString(16);
   }
  }
  else
   obj.value=0;
  break;
 case 40://down自減
  //value=!isNaN(parseInt(value))?parseInt(value):"";
  if(value=="")
   value="FF";
  if(parseInt(value,16)>0)
  {
      if(isUpcase){
    obj.value=(parseInt(value,16)-1).toString(16).toUpperCase();
   }else{
    obj.value=(parseInt(value,16)-1).toString(16);
   }
  };
  break;
 case 8://backspace
  if(pos.start>0)
   return;
 case 37://left
  if(pos.end==0 && index>1)
  {
   id=id.replace(/(\d)$/,parseInt(index)-1 );
   document.getElementById(id).focus();
   document.getElementById(id).select();
  }
  break;
 case 39://right
  if(pos.start==value.length && index<6)
  {
   id=id.replace(/(\d)$/,parseInt(index)+1 );
   document.getElementById(id).focus();
   document.getElementById(id).select();
  }
  break;
 }
},
//獲取選區(qū)位置
getSelection:function(oInput){
 var T=this;
 if(oInput.createTextRange){
  var s=document.selection.createRange().duplicate();
  s.moveStart("character",-oInput.value.length);
  var p1=s.text.length;
  var s=document.selection.createRange().duplicate();
  s.moveEnd("character",oInput.value.length);
  var p2=oInput.value.lastIndexOf(s.text);
  if(s.text=="")p2=oInput.value.length;
   return {start:p2,end:p1};
  }else {
   return {start:oInput.selectionStart,end:oInput.selectionEnd};
  }
 }
}
// --></mce:script>
<mce:style type="text/css"><!--
/*IP 輸入框*/
.macInput{
border:1px solid #ccc;

}
.macInput input{
border:0px solid #ccc;

height:16px;
width:24px;
background:transparent;
text-align:center;
}
--></mce:style><style type="text/css" mce_bogus="1">/*IP 輸入框*/
.macInput{
border:1px solid #ccc;

}
.macInput input{
border:0px solid #ccc;

height:16px;
width:24px;
background:transparent;
text-align:center;
}</style>
</head>
<body>
<span id="span1"></span>
<input type="button" value="mac1.getValue" onClick="alert(mac1.getValue())" />
<p>
<span id="span2"></span>
<mce:script type="text/javascript"><!--
var mac1=new MacBox("mac1");
document.getElementById("span1").innerHTML=mac1;
mac1.focus(1);//激活輸入框的第一部分
mac1.onEnterKey=function(){
alert("mac1 EnterKey");
}
//每成功輸入一個(gè)字每都會(huì)激發(fā)onChange事件
mac1.onChange=function(){
window.status="mac1 新mac:"+(this.getValue());
}
mac1.setValue("EF:00:34:3A:11:B2");
var mac2=new MacBox("mac2" , "span2");
// --></mce:script>
</body>
</html>
 

    網(wǎng)上的js ip控件比較多,我之所以選擇這個(gè),是因?yàn)槭褂盟浅7奖?。取值、設(shè)值功能都不錯(cuò),還有自加、自減功能,當(dāng)然,瀏覽器的兼容性也不錯(cuò)。我改裝后的MAC控件自然也都繼承了這些優(yōu)點(diǎn)。由于修改時(shí)間倉(cāng)促,多少會(huì)有一些不當(dāng)之處,還希望大家多提寶貴意見(jiàn),thx~

該文章在 2011/2/26 9:56:11 編輯過(guò)
關(guān)鍵字查詢(xún)
相關(guān)文章
正在查詢(xún)...
點(diǎn)晴ERP是一款針對(duì)中小制造業(yè)的專(zhuān)業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國(guó)內(nèi)大量中小企業(yè)的青睞。
點(diǎn)晴PMS碼頭管理系統(tǒng)主要針對(duì)港口碼頭集裝箱與散貨日常運(yùn)作、調(diào)度、堆場(chǎng)、車(chē)隊(duì)、財(cái)務(wù)費(fèi)用、相關(guān)報(bào)表等業(yè)務(wù)管理,結(jié)合碼頭的業(yè)務(wù)特點(diǎn),圍繞調(diào)度、堆場(chǎng)作業(yè)而開(kāi)發(fā)的。集技術(shù)的先進(jìn)性、管理的有效性于一體,是物流碼頭及其他港口類(lèi)企業(yè)的高效ERP管理信息系統(tǒng)。
點(diǎn)晴WMS倉(cāng)儲(chǔ)管理系統(tǒng)提供了貨物產(chǎn)品管理,銷(xiāo)售管理,采購(gòu)管理,倉(cāng)儲(chǔ)管理,倉(cāng)庫(kù)管理,保質(zhì)期管理,貨位管理,庫(kù)位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號(hào)管理軟件。
點(diǎn)晴免費(fèi)OA是一款軟件和通用服務(wù)都免費(fèi),不限功能、不限時(shí)間、不限用戶(hù)的免費(fèi)OA協(xié)同辦公管理系統(tǒng)。
Copyright 2010-2025 ClickSun All Rights Reserved

主站蜘蛛池模板: 手机免费在线观看日韩电影 | 欧美精品v日韩精品v韩国精品v | 亚洲精品国产v片 | 老司机精品一区在线视 | 国产短裙高 | 亚洲成年看片在线观看 | 国产狂喷潮在线观看中文 | 国产一区二区三区高清在线观看 | 国产精品视频免费一区二区三区 | 亚洲成aⅴ人片在线观看www | 国产亚洲欧美日韩在线观着 | 国产精品线在线精品国语 | 欧美a级v片不 | 日韩欧美一区二区三区视频在线 | 日韩伦理一区二区精品视频 | 短视频在线下载免费 | 欧美激情一区二区三区在线播放 | 三级黄日本| 成人日动漫卡一区二区三区动漫 | 中文字幕一区二区三区不卡 | 国产精品白丝a∨网站 | 国产精品一区二区制服 | 精品国产爱片 | a天堂中文在线天堂资源中文 | 一区二区三区四区在线视频 | 中文字幕在线看日本大片 | 亚洲欧美日韩国产另例 | 亚洲欧美自偷自拍另类视 | 国产日b | 欧美日韩免费专区在线 | 豆国产96在线 | 不卡的神马电影网 | 国产宅男宅女在线观看 | 五月天激情视频a级在线版 无吗一区二区三区 | 91伊人国产 | 美女视频黄a视频全免费网站二区 | 亚洲日本欧美日韩高观看 | 国产一区自拍视频 | 亚洲无线码在线一区观看 | 国产精品xxx在线 | 92国产精品午夜福利免费 |