我需要一个JQuery IP Mask插件

时间:2010-07-06 04:39:21

标签: javascript jquery jquery-plugins ip-address

JQuery有一个很好的IP掩码插件吗?我已经尝试了Masked Input Plugin,但它没有少于12位数的IP地址。然后我尝试了meioMask,这对于少于12位的数字也不起作用。有什么建议吗?

5 个答案:

答案 0 :(得分:9)

您可以在这篇文章中找到答案:

http://mlntn.com/2009/12/30/jquery-ip-address-plugin/

和您尝试的演示

http://mlntn.com/demos/jquery-ipaddress/

答案 1 :(得分:3)

这是一篇较旧的帖子,但对于想要一种简单的方法来操作多个输入,不使用扩展插件,或者不必担心文档或方法的人来说,这里有一个简单的类选择器方法,可以为您完成所有操作。它只有IPv4,但听起来你的需求非常简单。

//jQuery 1.9+ selector pattern,
//To get working with an older version
//Swap first line to $(".ip").bind('keydown',function(e){
//To get working with jQuery versions support .live
//$(".ip").live('keydown',function(e){
$(document).on('keydown',".ip",function(e){
    var code = e.keyCode || e.which;
    var sections = $(this).val().split('.');
    //Only check last section!
    var isInt       = ((code >= 48 && code <= 57) || (code >= 96 && code <= 105));
    var hasSlash    = $(this).val().indexOf("/") == -1;
    if(isInt){
        if(hasSlash){
            if(sections.length < 4){
                //We can add another octet
                var val = parseInt(sections[sections.length-1]+String.fromCharCode(code));
                if(val > 255 || parseInt(sections[sections.length-1]) == 0){
                    $(this).val($(this).val()+"."+String.fromCharCode(code));
                    return false;
                }
                return true;
            } else {
                //Lets prevent string manipulations, our string is long enough
                var val = parseInt(sections[sections.length-1]+String.fromCharCode(code));
                if(val > 255 || parseInt(sections[sections.length-1]) == 0){
                    return false;
                }
                return true;
            }
        } else {
            var cidr_split = $(this).val().split('/');
            var target_val = parseInt(cidr_split[1]+String.fromCharCode(code));
            return (target_val < 33 && target_val.toString().length < 3 && parseInt(cidr_split[1]) != 0);
        }
    } else if(code == 191){
        //CIDR Slash
        return ($(this).val().indexOf("/") == -1);
    } else if(code == 8 || code == 46 || code == 9 || code == 13){
        return true;
    }
    return false
});

为了理解这一点,你可以在你的输入中绑定类“ip”,它将自动处理其余的:D这个版本支持CIDR表示法(例如:192.168.1.1/16)它只允许有效的地址输入,要删除可以使用的CIDR功能,请使用以下代码段(未测试)

//jQuery 1.9+ selector pattern,
//To get working with an older version
//Swap first line to $(".ip").bind('keydown',function(e){
//To get working with jQuery versions support .live
//$(".ip").live('keydown',function(e){
$(document).on('keydown',".ip",function(e){
    var code = e.keyCode || e.which;
    var sections = $(this).val().split('.');
    //Only check last section!
    var isInt       = ((code >= 48 && code <= 57) || (code >= 96 && code <= 105));
    if(isInt){
        if(sections.length < 4){
            //We can add another octet
            var val = parseInt(sections[sections.length-1]+String.fromCharCode(code));
            if(val > 255 || parseInt(sections[sections.length-1]) == 0){
                $(this).val($(this).val()+"."+String.fromCharCode(code));
                return false;
            }
            return true;
        } else {
            //Lets prevent string manipulations, our string is long enough
            var val = parseInt(sections[sections.length-1]+String.fromCharCode(code));
            if(val > 255 || parseInt(sections[sections.length-1]) == 0){
                return false;
            }
            return true;
        }
    } else if(code == 8 || code == 46 || code == 9 || code == 13){
        return true;
    }
    return false
});

我在这里提供的代码有两个目的1)这是我认为需要解决的问题,2)我希望为世界做出贡献

如果您需要IPv6支持,该代码段不能拆分,也不支持IPv6,请参阅https://code.google.com/p/jquery-input-ip-address-control/任何建议。

但是除了复杂的语法之外,它会将八位字节分开,并且只检查“活动”八位字节,它支持任何VALID地址(0.0.0.0,0.0.0.0/0,等),因此请明智地使用它不做任何花哨的检查,而不是防止无效输入。如果您正在寻找一个检查器,请参阅Santiago Elvira Ramirez关于IP地址验证器的帖子。

答案 2 :(得分:2)

答案 3 :(得分:1)

Masked Input Plugin的工作示例 -
http://digitalbush.com/projects/masked-input-plugin/

少于12个字符:

jQuery(function($){
   $("#date").mask("99/99/9999");
   $("#phone").mask("(999) 999-9999");
   $("#tin").mask("99-9999999");
   $("#ssn").mask("999-99-9999");
});

他们有完美运行的工作示例吗?

你的问题很简单,你可以发布更深入的信息吗?

jQuery(function($){
    $("#MyElementID").mask("10.0.0.0"); //Does this not work?
});

您是否尝试在每个字段中计算1-3位数字?

例如能够。

$("#MyElementID").mask("1.0.0.0"); //this
$("#MyElementID").mask("10.10.10.10"); //or this
$("#MyElementID").mask("100.100.100.100"); //or this

如果你更具描述性,你可以得到帮助..

如果您在此之后,您可以通过为输入框添加水印而不是强制执行掩码来尝试更简单的操作,这样您就可以改变可输入的数字。 见Jquery-Watermark - http://code.google.com/p/jquery-watermark/

答案 4 :(得分:1)

我找到了这个,你不需要安装插件

function fnValidateIPAddress(ipaddr) {
    //Remember, this function will validate only Class C IP.
    //change to other IP Classes as you need
    ipaddr = ipaddr.replace( /\s/g, "") //remove spaces for checking
    var re = /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/; //regex. check for digits and in
                                          //all 4 quadrants of the IP
    if (re.test(ipaddr)) {
        //split into units with dots "."
        var parts = ipaddr.split(".");
        //if the first unit/quadrant of the IP is zero
        if (parseInt(parseFloat(parts[0])) == 0) {
            return false;
        }
        //if the fourth unit/quadrant of the IP is zero
        if (parseInt(parseFloat(parts[3])) == 0) {
            return false;
        }
        //if any part is greater than 255
        for (var i=0; i<parts.length; i++) {
            if (parseInt(parseFloat(parts[i])) > 255){
                return false;
            }
        }
        return true;
    } else {
        return false;
    }
}