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

Want to validate the user on a button click for ipaddress field using jquery input mask plugin

本文关键字：字段 jquery 输入 插件 掩码 ipaddress 用户 验证 按钮      更新时间：2023-09-26

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

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

这是我的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上用户的方法点击

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

            });

请帮助我谢谢

您可以尝试如下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');
}
相关文章：