jquery.mask.js

jquery.mask.js 介绍

jquery.mask.js是一款jQuery输入框限制输入内容格式插件。该插件可以通过指定的规则来限制用户在输入框中输入的内容，例如限制日期格式，限制电话号码格式等，非常实用。  

jquery.mask.js安装或引用

bower install jquery-mask-plugin

npm i jquery-mask-plugin

或

<script src="jquery.min.js"></script>

<script src="jquery.mask.js"></script>

jquery.mask.js基本使用

$(document).ready(function(){

$('.date').mask('00/00/0000');

$('.time').mask('00:00:00');

$('.date_time').mask('00/00/0000 00:00:00');

$('.cep').mask('00000-000');

$('.phone').mask('0000-0000');

$('.phone_with_ddd').mask('[phone]');

$('.phone_us').mask('[phone]');

$('.mixed').mask('AAA 000-S0S');

$('.cpf').mask('000.000.000-00',{reverse: true});

$('.cnpj').mask('00.000.000/0000-00',{reverse: true});

$('.money').mask('000.000.000.000.000,00',{reverse: true});

$('.money2').mask("#.##0,00",{reverse: true});

$('.ip_address').mask('0ZZ.0ZZ.0ZZ.0ZZ',{

translation: {

'Z': {

pattern: /[0-9]/,optional: true

}

}

});

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

$('.percent').mask('##0,00%',{reverse: true});

$('.clear-if-not-match').mask("00/00/0000",{clearIfNotMatch: true});

$('.placeholder').mask("00/00/0000",{placeholder: "__/__/____"});

$('.fallback').mask("00r00r0000",{

translation: {

'r': {

pattern: /[/]/,

fallback: '/'

},

placeholder: "__/__/____"

}

});

$('.selectonfocus').mask("00/00/0000",{selectOnFocus: true});

});

除了上面这样的方式外，你可以直接在html标签上通过data-mask属性来限制用户输入的内容格式，如：

<input type="text" name="field-name" data-mask="00/00/0000" />

<input type="text" name="field-name" data-mask="00/00/0000" data-mask-reverse="true" />

<input type="text" name="field-name" data-mask="00/00/0000" data-mask-clearifnotmatch="true" />

<input type="text" name="field-name" data-mask="00/00/0000" data-mask-selectonfocus="true" />

网站地址:http://igorescobar.github.io/jQuery-Mask-Plugin/

GitHub:https://github.com/igorescobar/jQuery-Mask-Plugin

网站描述:一款jQuery输入框限制输入内容格式插件

jquery.mask.js

官方网站：http://igorescobar.github.io/jQuery-Mask-Plugin/