Question

所以我需要验证输入字段以接受IP地址。

<form method="POST">
    <input type='text' placeholder='xxx.xxx.xxx.xxx' name='IP'>
</form>

由于属性type没有IP值，我需要使用 Javascript 或某种客户端语言对其进行验证。我使用mask library来了解这个 jQuery 代码段。

jQuery(function($){
   $("input").mask("9?99.9?99.9?99.9?99", {placeholder:" "});
});

然而，这对我不起作用。以下是我如何包含脚本（仅指出）。

<script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="https://raw.githubusercontent.com/digitalBush/jquery.maskedinput/1.3.1/dist/jquery.maskedinput.js" type="text/javascript"></script>

此外，即使我设法使这项工作，它仍然不是最好的选择，因为IP地址的两位数部分将无法正确呈现（即84.55.11.499） 。所以我的问题是：

为什么上面的代码在我的结尾不起作用，但在 JSFiddle 上呢？
如何使用掩码库过滤两位数的IP地址？

Answer 1

我知道已经晚了，我知道你需要jQuery，但是如果你在HTML5中不知道它，你可以使用带有常规表达的模式属性......

例如：

<input required pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$">

常规表达将验证IP地址，如：

xxx.xxx.xxx.xxx
x.x.x.x
xx.xx.xx.xx
x.xx.xxx.xx

Answer 2

我看到你已经在使用jQuery插件了 - 试试这个有完整工作IP掩码的插件

This plugin here

它是这样完成的：

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

或相同 - 更短的：

 $('.ip_address').mask('099.099.099.099');

最后一个示例是我的fiddle示例中使用的最后一行

根据jQuery掩码文档：

0：只有数字。

9：只有数字，但可选。

所以你看 - 099.099.099.099，如果你想强制每个小数之间有两位数009.009.009.009

Answer 3

我知道这篇文章很旧，但是我认为以下代码是正确的答案。

例如：

<input type="text" class="form-input" id="ipv4" name="ipv4" placeholder="xxx.xxx.xxx.xxx"/>

jQuery代码

var ipv4_address = $('#ipv4');
ipv4_address.inputmask({
   alias: "ip",
   "placeholder": "_"
});

This code in codepen

使用jQuery屏蔽HTML输入表单的IP

3 个答案: