想要使用 jquery 输入掩码插件在按钮单击 ipaddress 字段时验证用户

Posted 2023-05-09

【中文标题】想要使用 jquery 输入掩码插件在按钮单击 ipaddress 字段时验证用户

【英文标题】：Want to validate the user on a button click for ipaddress field using jquery input mask plugin

【发布时间】：2015-10-08 13:27:03

【问题描述】：

我正在使用 jquery 掩码插件https://igorescobar.github.io/jQuery-Mask-Plugin/

如果用户输入192.3.4. 并忘记在. 之后输入值，我想验证字段 ipaddress 然后我想验证文本输入框，然后当用户单击保存按钮时

这是我的 html

<input type="text" class="form-control ip_address" placeholder="*IP Address">

这是我的插件掩码 jquery

$('.ip_address').mask('0ZZ.0ZZ.0ZZ.0ZZ', 
       translation: 
                      'Z': 
                            pattern: /[0-9]/, optional: true
                           
                  
);

这就是我想在 burron click 上验证用户的方式

$('.btnsaveForm').on('click', function(e) 
                    e.preventDefault();
                     var ip = $('.ip_address').val();
                     if(ip)
                        alert('ip address');
                     else
                        alert('not an ip address');
                     


            );

请帮帮我谢谢

【问题讨论】：

只是想解释一下 if(ip) ip 地址格式为真然后显示成功信息，否则显示错误信息

【参考方案1】：

您可以尝试如下RegExp。

$('.btnsaveForm').on('click', function(e) 
    e.preventDefault();
    var ip = $('.ip_address').val();
    if(/^\d+\.\d+\.\d+\.\d+$/.test(ip)) 
        alert('valid ip address');
    else
        alert('not an ip address');
    
);

\d+ => 仅匹配数字 \. => 匹配 . ^ => 输入起点 $ => 输入终点

编辑：您可以编写如下所示的基本插件。

(function ( $ ) 

    $.fn.isIpv4 = function() 
        return /^\d+\.\d+\.\d+\.\d+$/.test( $(this).val() );
    ;    
( jQuery ));

将其用作：

var ip = $('.ip_address'); // no val() here!
if( ip.isIpv4() ) 
    alert('valid ip address');

编辑：根据您的最后评论，您最好使用如下函数，因为jQuery 插件不是为此而设计的。

function isIpv4(ip) 
    return /^\d+\.\d+\.\d+\.\d+$/.test(ip);


var ipAdd = $('.ip_address').val();
if( isIpv4(ipAdd) ) 
    alert('valid ip address');

【讨论】：

@Ishettyl 能否请您提供插件解决方案，如果您有任何帮助，那么这个正则表达式正在工作，但我更喜欢插件解决方案。再次感谢

谢谢，让我测试一下

@Ishettyl 如果我想使用 $('.ip_address').val(); 将值传递给 isIpv4();我该怎么做，你能帮帮我吗